/*!
  * element3 v0.0.39
  * (c) 2021 kkb
  * @license MIT
  */
var Element3 = (function (exports, vue) {
  'use strict';

  /* istanbul ignore next */

  const SPECIAL_CHARS_REGEXP = /([\:\-\_]+(.))/g;
  const MOZ_HACK_REGEXP = /^moz([A-Z])/;
  const ieVersion = Number(document.documentMode);
  /* istanbul ignore next */

  const trim = function (string) {
    return (string || '').replace(/^[\s\uFEFF]+|[\s\uFEFF]+$/g, '');
  };
  /* istanbul ignore next */


  const camelCase = function (name) {
    return name.replace(SPECIAL_CHARS_REGEXP, function (_, separator, letter, offset) {
      return offset ? letter.toUpperCase() : letter;
    }).replace(MOZ_HACK_REGEXP, 'Moz$1');
  };
  /* istanbul ignore next */


  const on = function () {
    if (document.addEventListener) {
      return function (element, event, handler) {
        if (element && event && handler) {
          element.addEventListener(event, handler, false);
        }
      };
    } else {
      return function (element, event, handler) {
        if (element && event && handler) {
          element.attachEvent('on' + event, handler);
        }
      };
    }
  }();
  /* istanbul ignore next */

  const off = function () {
    if (document.removeEventListener) {
      return function (element, event, handler) {
        if (element && event) {
          element.removeEventListener(event, handler, false);
        }
      };
    } else {
      return function (element, event, handler) {
        if (element && event) {
          element.detachEvent('on' + event, handler);
        }
      };
    }
  }();
  /* istanbul ignore next */

  const once = function (el, event, fn) {
    var listener = function () {
      if (fn) {
        fn.apply(this, arguments);
      }

      off(el, event, listener);
    };

    on(el, event, listener);
  };
  /* istanbul ignore next */

  function hasClass(el, cls) {
    if (!el || !cls) return false;
    if (cls.indexOf(' ') !== -1) throw new Error('className should not contain space.');

    if (el.classList) {
      return el.classList.contains(cls);
    } else {
      return (' ' + el.className + ' ').indexOf(' ' + cls + ' ') > -1;
    }
  }
  /* istanbul ignore next */

  function addClass(el, cls) {
    if (!el) return;
    var curClass = el.className;
    var classes = (cls || '').split(' ');

    for (var i = 0, j = classes.length; i < j; i++) {
      var clsName = classes[i];
      if (!clsName) continue;

      if (el.classList) {
        el.classList.add(clsName);
      } else if (!hasClass(el, clsName)) {
        curClass += ' ' + clsName;
      }
    }

    if (!el.classList) {
      el.className = curClass;
    }
  }
  /* istanbul ignore next */

  function removeClass(el, cls) {
    if (!el || !cls) return;
    var classes = cls.split(' ');
    var curClass = ' ' + el.className + ' ';

    for (var i = 0, j = classes.length; i < j; i++) {
      var clsName = classes[i];
      if (!clsName) continue;

      if (el.classList) {
        el.classList.remove(clsName);
      } else if (hasClass(el, clsName)) {
        curClass = curClass.replace(' ' + clsName + ' ', ' ');
      }
    }

    if (!el.classList) {
      el.className = trim(curClass);
    }
  }
  /* istanbul ignore next */

  const getStyle = ieVersion < 9 ? function (element, styleName) {
    if (!element || !styleName) return null;
    styleName = camelCase(styleName);

    if (styleName === 'float') {
      styleName = 'styleFloat';
    }

    try {
      switch (styleName) {
        case 'opacity':
          try {
            return element.filters.item('alpha').opacity / 100;
          } catch (e) {
            return 1.0;
          }

        default:
          return element.style[styleName] || element.currentStyle ? element.currentStyle[styleName] : null;
      }
    } catch (e) {
      return element.style[styleName];
    }
  } : function (element, styleName) {
    if (!element || !styleName) return null;
    styleName = camelCase(styleName);

    if (styleName === 'float') {
      styleName = 'cssFloat';
    }

    try {
      var computed = document.defaultView.getComputedStyle(element, '');
      return element.style[styleName] || computed ? computed[styleName] : null;
    } catch (e) {
      return element.style[styleName];
    }
  };
  const isScroll = (el, vertical) => {
    const determinedDirection = vertical !== null || vertical !== undefined;
    const overflow = determinedDirection ? vertical ? getStyle(el, 'overflow-y') : getStyle(el, 'overflow-x') : getStyle(el, 'overflow');
    return overflow.match(/(scroll|auto)/);
  };
  const getScrollContainer = (el, vertical) => {
    let parent = el;

    while (parent) {
      if ([window, document, document.documentElement].includes(parent)) {
        return window;
      }

      if (isScroll(parent, vertical)) {
        return parent;
      }

      parent = parent.parentNode;
    }

    return parent;
  };
  const isInContainer = (el, container) => {
    if (!el || !container) return false;
    const elRect = el.getBoundingClientRect();
    let containerRect;

    if ([window, document, document.documentElement, null, undefined].includes(container)) {
      containerRect = {
        top: 0,
        right: window.innerWidth,
        bottom: window.innerHeight,
        left: 0
      };
    } else {
      containerRect = container.getBoundingClientRect();
    }

    return elRect.top < containerRect.bottom && elRect.bottom > containerRect.top && elRect.right > containerRect.left && elRect.left < containerRect.right;
  };

  class TransitionFn {
    beforeEnter(el) {
      addClass(el, 'collapse-transition');
      !el.dataset && (el.dataset = {});
      el.dataset.oldPaddingTop = el.style.paddingTop;
      el.dataset.oldPaddingBottom = el.style.paddingBottom;
      el.style.height = '0';
      el.style.paddingTop = 0;
      el.style.paddingBottom = 0;
    }

    enter(el) {
      el.dataset.oldOverflow = el.style.overflow;

      if (el.scrollHeight !== 0) {
        el.style.height = el.scrollHeight + 'px';
        el.style.paddingTop = el.dataset.oldPaddingTop;
        el.style.paddingBottom = el.dataset.oldPaddingBottom;
      } else {
        el.style.height = '';
        el.style.paddingTop = el.dataset.oldPaddingTop;
        el.style.paddingBottom = el.dataset.oldPaddingBottom;
      }

      el.style.overflow = 'hidden';
    }

    afterEnter(el) {
      // for safari: remove class then reset height is necessary
      removeClass(el, 'collapse-transition');
      el.style.height = '';
      el.style.overflow = el.dataset.oldOverflow;
    }

    beforeLeave(el) {
      if (!el.dataset) el.dataset = {};
      el.dataset.oldPaddingTop = el.style.paddingTop;
      el.dataset.oldPaddingBottom = el.style.paddingBottom;
      el.dataset.oldOverflow = el.style.overflow;
      el.style.height = el.scrollHeight + 'px';
      el.style.overflow = 'hidden';
    }

    leave(el) {
      if (el.scrollHeight !== 0) {
        // for safari: add class after set height, or it will jump to zero height suddenly, weired
        addClass(el, 'collapse-transition');
        el.style.height = 0;
        el.style.paddingTop = 0;
        el.style.paddingBottom = 0;
      }
    }

    afterLeave(el) {
      removeClass(el, 'collapse-transition');
      el.style.height = '';
      el.style.overflow = el.dataset.oldOverflow;
      el.style.paddingTop = el.dataset.oldPaddingTop;
      el.style.paddingBottom = el.dataset.oldPaddingBottom;
    }

  }

  const ElCollapseTransition = (props, context) => {
    const transitions = new TransitionFn();
    const data = {
      onBeforeEnter: transitions.beforeEnter,
      onEnter: transitions.enter,
      onAfterEnter: transitions.afterEnter,
      onBeforeLeave: transitions.beforeLeave,
      onLeave: transitions.leave,
      onAfterLeave: transitions.afterLeave
    };
    return vue.h(vue.Transition, data, context.slots);
  };

  ElCollapseTransition.install = function (app) {
    app.component('ElCollapseTransition', ElCollapseTransition);
  };

  var ElRow = {
    name: 'ElRow',
    componentName: 'ElRow',

    setup(props) {
      const style = vue.computed(() => {
        const ret = {};

        if (props.gutter) {
          ret.marginLeft = `-${props.gutter / 2}px`;
          ret.marginRight = ret.marginLeft;
        }

        return ret;
      });
      vue.provide('el-row', vue.getCurrentInstance());
      return {
        style
      };
    },

    props: {
      tag: {
        type: String,
        default: 'div'
      },
      gutter: {
        type: Number,
        default: 0
      },
      type: String,
      justify: {
        type: String,
        default: 'start'
      },
      align: {
        type: String,
        default: 'top'
      }
    },

    render() {
      return vue.h(this.tag, {
        class: ['el-row', this.justify !== 'start' ? `is-justify-${this.justify}` : '', this.align !== 'top' ? `is-align-${this.align}` : '', {
          'el-row--flex': this.type === 'flex'
        }],
        style: this.style
      }, this.$slots.default && this.$slots.default());
    }

  };

  /* istanbul ignore next */

  ElRow.install = function (app) {
    app.component(ElRow.name, ElRow);
  };

  var script$1B = {
    name: 'ElCol',
    props: {
      span: {
        type: Number,
        default: 24
      },
      tag: {
        type: String,
        default: 'div'
      },
      offset: Number,
      pull: Number,
      push: Number,
      xs: [Number, Object],
      sm: [Number, Object],
      md: [Number, Object],
      lg: [Number, Object],
      xl: [Number, Object]
    },

    setup(props, {
      slots
    }) {
      const {
        tag
      } = vue.toRefs(props);
      const gutter = vue.computed(() => {
        let {
          parent
        } = vue.getCurrentInstance();

        while (parent && parent.type.componentName !== 'ElRow') {
          parent = parent.parent;
        }

        return parent ? parent.props.gutter : 0;
      });
      return () => {
        const classList = [];
        const style = {};

        if (vue.unref(gutter)) {
          style.paddingLeft = vue.unref(gutter) / 2 + 'px';
          style.paddingRight = style.paddingLeft;
        }
        ['span', 'offset', 'pull', 'push'].forEach(prop => {
          if (vue.unref(vue.toRefs(props)[prop]) || vue.unref(vue.toRefs(props)[prop]) === 0) {
            classList.push(prop !== 'span' ? `el-col-${prop}-${vue.unref(vue.toRefs(props)[prop])}` : `el-col-${vue.unref(vue.toRefs(props)[prop])}`);
          }
        });
        ['xs', 'sm', 'md', 'lg', 'xl'].forEach(size => {
          if (typeof vue.unref(vue.toRefs(props)[size]) === 'number') {
            classList.push(`el-col-${size}-${vue.unref(vue.toRefs(props)[size])}`);
          } else if (typeof vue.unref(vue.toRefs(props)[size]) === 'object') {
            const propsData = vue.unref(vue.toRefs(props)[size]);
            Object.keys(propsData).forEach(prop => {
              classList.push(prop !== 'span' ? `el-col-${size}-${prop}-${propsData[prop]}` : `el-col-${size}-${propsData[prop]}`);
            });
          }
        });
        return vue.h(vue.unref(tag), {
          class: ['el-col', classList],
          style
        }, slots.default ? slots.default() : '');
      };
    }

  };

  script$1B.__file = "packages/col/Col.vue";

  /* istanbul ignore next */

  script$1B.install = function (app) {
    app.component(script$1B.name, script$1B);
  };

  var script$1A = {
    name: 'ElContainer',
    props: {
      direction: {
        type: String,
        default: 'horizontal'
      }
    },

    setup(props, {
      slots
    }) {
      const {
        direction
      } = vue.toRefs(props);
      const isVertical = vue.computed(() => {
        if (direction === 'vertical') {
          return true;
        } else if (direction === 'horizontal') {
          return false;
        }

        if (slots && slots.default) {
          return slots.default().some(vNode => {
            const tag = vNode.type && vNode.type.name;
            return tag === 'ElHeader' || tag === 'ElFooter';
          });
        } else {
          return false;
        }
      });
      return {
        isVertical
      };
    }

  };

  function render$1q(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("section", {
      class: ["el-container", {
        'is-vertical': $setup.isVertical
      }]
    }, [vue.renderSlot(_ctx.$slots, "default")], 2
    /* CLASS */
    );
  }

  script$1A.render = render$1q;
  script$1A.__file = "src/components/Container/src/Container.vue";

  /* istanbul ignore next */

  script$1A.install = function (app) {
    app.component(script$1A.name, script$1A);
  };

  var script$1z = {
    name: 'ElHeader',
    props: {
      height: {
        type: String,
        default: '60px'
      }
    }
  };

  function render$1p(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("header", {
      class: "el-header",
      style: {
        height: $props.height
      }
    }, [vue.renderSlot(_ctx.$slots, "default")], 4
    /* STYLE */
    );
  }

  script$1z.render = render$1p;
  script$1z.__file = "packages/header/Header.vue";

  /* istanbul ignore next */

  script$1z.install = function (app) {
    app.component(script$1z.name, script$1z);
  };

  var script$1y = {
    name: 'ElFooter',
    componentName: 'ElFooter',
    props: {
      height: {
        type: String,
        default: '60px'
      }
    }
  };

  function render$1o(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("footer", {
      class: "el-footer",
      style: {
        height: $props.height
      }
    }, [vue.renderSlot(_ctx.$slots, "default")], 4
    /* STYLE */
    );
  }

  script$1y.render = render$1o;
  script$1y.__file = "packages/footer/Footer.vue";

  /* istanbul ignore next */

  script$1y.install = function (app) {
    app.component(script$1y.name, script$1y);
  };

  var script$1x = {
    name: 'ElAside',
    componentName: 'ElAside',
    props: {
      width: {
        type: String,
        default: '300px'
      }
    }
  };

  function render$1n(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("aside", {
      class: "el-aside",
      style: {
        width: $props.width
      }
    }, [vue.renderSlot(_ctx.$slots, "default")], 4
    /* STYLE */
    );
  }

  script$1x.render = render$1n;
  script$1x.__file = "packages/aside/Aside.vue";

  /* istanbul ignore next */

  script$1x.install = function (app) {
    app.component(script$1x.name, script$1x);
  };

  var script$1w = {
    name: 'ElMain',
    componentName: 'ElMain'
  };

  const _hoisted_1$Y = {
    class: "el-main"
  };
  function render$1m(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("main", _hoisted_1$Y, [vue.renderSlot(_ctx.$slots, "default")]);
  }

  script$1w.render = render$1m;
  script$1w.__file = "packages/main/Main.vue";

  /* istanbul ignore next */

  script$1w.install = function (app) {
    app.component(script$1w.name, script$1w);
  };

  var script$1v = {
    name: 'ElIcon',
    props: {
      name: String
    }
  };

  function render$1l(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("i", {
      class: `el-icon-${$props.name}`
    }, null, 2
    /* CLASS */
    );
  }

  script$1v.render = render$1l;
  script$1v.__file = "packages/icon/Icon.vue";

  /* istanbul ignore next */

  script$1v.install = function (app) {
    app.component(script$1v.name, script$1v);
  };

  const props$7 = {
      size: {
          type: String,
          validator(val) {
              return ['medium', 'small', 'mini', ''].includes(val);
          }
      },
      type: {
          type: String,
          validator(val) {
              return [
                  'primary',
                  'success',
                  'warning',
                  'danger',
                  'info',
                  'text'
              ].includes(val);
          }
      },
      nativeType: {
          type: String,
          default: 'button'
      },
      plain: Boolean,
      round: Boolean,
      circle: Boolean,
      loading: Boolean,
      disabled: Boolean,
      icon: String
  };

  /**
   * get globalOptions $ELEMENT config object
   */

  function useGlobalOptions() {
    const instance = vue.getCurrentInstance();

    if (!instance) {
      console.warn('useGlobalOptions must be call in setup function');
      return;
    }

    return instance.appContext.config.globalProperties.$ELEMENT || {};
  }
  function setupGlobalOptions(opts = {}) {
    return app => {
      app.config.globalProperties.$ELEMENT = {
        size: opts.size || '',
        zIndex: opts.zIndex || 2000
      };
    };
  }

  var script$1u = vue.defineComponent({
    name: 'ElButton',
    props: props$7,

    setup(props) {
      const {
        size,
        disabled
      } = vue.toRefs(props);
      const buttonSize = useButtonSize(size);
      const buttonDisabled = useButtonDisabled(disabled);
      const classes = useClasses$5({
        props,
        size: buttonSize,
        disabled: buttonDisabled
      });
      return {
        buttonDisabled,
        classes
      };
    }

  });

  const useClasses$5 = ({
    props,
    size,
    disabled
  }) => {
    return vue.computed(() => {
      return [size.value ? `el-button--${size.value}` : '', props.type ? `el-button--${props.type}` : '', {
        'is-plain': props.plain,
        'is-round': props.round,
        'is-circle': props.circle,
        'is-loading': props.loading,
        'is-disabled': disabled.value
      }];
    });
  };

  const useButtonDisabled = disabled => {
    return vue.computed(() => {
      const elForm = vue.inject('elForm', null);
      return (disabled === null || disabled === void 0 ? void 0 : disabled.value) || (elForm === null || elForm === void 0 ? void 0 : elForm.disabled);
    });
  };

  const useButtonSize = size => {
    const globalConfig = useGlobalOptions();
    return vue.computed(() => {
      const elFormItem = vue.inject('elFormItem', null);
      return (size === null || size === void 0 ? void 0 : size.value) || (elFormItem === null || elFormItem === void 0 ? void 0 : elFormItem.elFormItemSize) || globalConfig.size;
    });
  };

  const _hoisted_1$X = {
    key: 0,
    class: "el-icon-loading",
    "data-testid": "loadingIcon"
  };
  const _hoisted_2$B = {
    key: 2
  };
  function render$1k(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("button", {
      class: ["el-button", _ctx.classes],
      type: _ctx.nativeType,
      disabled: _ctx.buttonDisabled || _ctx.loading
    }, [_ctx.loading ? (vue.openBlock(), vue.createBlock("i", _hoisted_1$X)) : _ctx.icon ? (vue.openBlock(), vue.createBlock("i", {
      key: 1,
      class: _ctx.icon,
      "data-testid": "icon"
    }, null, 2
    /* CLASS */
    )) : vue.createCommentVNode("v-if", true), _ctx.$slots.default ? (vue.openBlock(), vue.createBlock("span", _hoisted_2$B, [vue.renderSlot(_ctx.$slots, "default")])) : vue.createCommentVNode("v-if", true)], 10
    /* CLASS, PROPS */
    , ["type", "disabled"]);
  }

  script$1u.render = render$1k;
  script$1u.__file = "src/components/Button/src/Button.vue";

  script$1u.install = function (app) {
    app.component(script$1u.name, script$1u);
  };

  var script$1t = {
    name: 'ElButtonGroup'
  };

  const _hoisted_1$W = {
    class: "el-button-group"
  };
  function render$1j(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("div", _hoisted_1$W, [vue.renderSlot(_ctx.$slots, "default")]);
  }

  script$1t.render = render$1j;
  script$1t.__file = "packages/button-group/ButtonGroup.vue";

  /* istanbul ignore next */

  script$1t.install = function (app) {
    app.component(script$1t.name, script$1t);
  };

  var script$1s = {
    name: 'ElLink',
    props: {
      type: {
        type: String,
        default: 'default'
      },
      disabled: {
        type: Boolean,
        default: false
      },
      underline: {
        type: Boolean,
        default: true
      },
      href: String,
      icon: String
    },
    emits: ['click'],

    setup(props, {
      emit
    }) {
      const classes = useClasses$4(props);

      const handleClick = event => {
        if (props.disabled) return;
        if (props.href) return;
        emit('click', event);
      };

      return {
        classes,
        handleClick
      };
    }

  };

  const useClasses$4 = props => {
    return ['el-link', props.type ? `el-link--${props.type}` : '', props.disabled && 'is-disabled', props.underline && !props.disabled && 'is-underline'];
  };

  const _hoisted_1$V = {
    key: 1,
    class: "el-link--inner"
  };
  function render$1i(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("a", vue.mergeProps({
      class: $setup.classes,
      href: $props.disabled ? null : $props.href
    }, _ctx.$attrs, {
      onClick: _cache[1] || (_cache[1] = (...args) => $setup.handleClick && $setup.handleClick(...args))
    }), [$props.icon ? (vue.openBlock(), vue.createBlock("i", {
      key: 0,
      class: $props.icon
    }, null, 2
    /* CLASS */
    )) : vue.createCommentVNode("v-if", true), _ctx.$slots.default ? (vue.openBlock(), vue.createBlock("span", _hoisted_1$V, [vue.renderSlot(_ctx.$slots, "default")])) : vue.createCommentVNode("v-if", true)], 16
    /* FULL_PROPS */
    , ["href"]);
  }

  script$1s.render = render$1i;
  script$1s.__file = "src/components/Link/src/Link.vue";

  /* istanbul ignore next */

  script$1s.install = function (app) {
    app.component(script$1s.name, script$1s);
  };

  const props$6 = {
    modelValue: {
      type: [String, Number, Symbol, Boolean, Array],
      default: ''
    },
    label: {
      type: [String, Number, Symbol, Boolean, Array],
      default: ''
    },
    disabled: {
      type: Boolean,
      default: false
    },
    name: {
      type: String,
      default: ''
    },
    border: {
      type: Boolean,
      default: false
    },
    size: {
      type: String,
      default: ''
    }
  };

  var script$1r = vue.defineComponent({
    name: 'ElRadio',
    componentName: 'ElRadio',
    props: props$6,
    emits: ['update:modelValue', 'update:value', 'change'],

    setup(props, context) {
      const focus = vue.ref(false);
      const {
        elForm,
        elFormItem
      } = useInject();
      const {
        isGroup,
        radioGroup
      } = useCheckGroup$1();
      const radioValue = vue.computed({
        get: () => isGroup ? radioGroup.proxy.modelValue : props.modelValue,
        set: value => {
          changeHandler(value);
        }
      });
      const {
        isDisabled,
        radioSize,
        tabIndex
      } = useStyle$6({
        props,
        isGroup,
        radioGroup,
        elForm,
        elFormItem,
        radioValue
      });
      const labelClass = useLabelClass({
        props,
        radioSize,
        radioValue,
        isDisabled,
        focus
      });

      const changeHandler = value => {
        context.emit('update:modelValue', value);
        isGroup && radioGroup.emit('update:modelValue', value);
        context.emit('change', value);
        isGroup && radioGroup.emit('change', value);
      };

      return {
        focus,
        radioValue,
        isDisabled,
        radioSize,
        tabIndex,
        labelClass,
        changeHandler
      };
    }

  });

  const useInject = () => {
    const elForm = vue.inject('elForm', {});
    const elFormItem = vue.inject('elFormItem', {});
    return {
      elForm,
      elFormItem
    };
  };

  const useCheckGroup$1 = () => {
    const {
      parent
    } = vue.getCurrentInstance();
    const isGroup = parent.type.name === 'ElRadioGroup';
    const radioGroup = isGroup ? parent : null;
    return {
      isGroup,
      radioGroup
    };
  };

  const useStyle$6 = ({
    props,
    isGroup,
    radioGroup,
    elForm,
    elFormItem,
    radioValue
  }) => {
    const {
      proxy,
      parent: {
        proxy: {
          radioGroupSize
        }
      }
    } = vue.getCurrentInstance();
    const elFormDisable = elForm.disabled;
    const isDisabled = vue.computed(() => isGroup ? radioGroup.props.disabled || props.disabled || elFormDisable : props.disabled || elFormDisable);
    const radioSize = vue.computed(() => props.size || radioGroupSize || elForm && elFormItem.elFormItemSize || (proxy.$ELEMENT || {}).size);
    const tabIndex = vue.computed(() => isDisabled.value || isGroup && radioValue.value !== props.label ? -1 : 0);
    return {
      isDisabled,
      radioSize,
      tabIndex
    };
  };

  const useLabelClass = ({
    props,
    radioSize,
    radioValue,
    isDisabled,
    focus
  }) => vue.computed(() => [props.border && radioSize.value ? `el-radio--${radioSize.value}` : '', {
    'is-checked': radioValue.value === props.label
  }, {
    'is-disabled': isDisabled.value
  }, {
    'is-focus': focus.value
  }, {
    'is-bordered': props.border
  }]);

  const _hoisted_1$U = /*#__PURE__*/vue.createVNode("span", {
    class: "el-radio__inner"
  }, null, -1
  /* HOISTED */
  );

  function render$1h(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("label", {
      role: "radio",
      class: ["el-radio", _ctx.labelClass],
      "aria-checked": _ctx.radioValue === _ctx.label,
      "aria-disabled": _ctx.isDisabled,
      tabindex: _ctx.tabIndex
    }, [vue.createVNode("span", {
      class: ["el-radio__input", {
        'is-disabled': _ctx.isDisabled,
        'is-checked': _ctx.radioValue === _ctx.label
      }]
    }, [_hoisted_1$U, vue.withDirectives(vue.createVNode("input", {
      type: "radio",
      class: "el-radio__original",
      value: _ctx.label,
      "onUpdate:modelValue": _cache[1] || (_cache[1] = $event => _ctx.radioValue = $event),
      name: _ctx.name,
      "aria-hidden": "true",
      disabled: _ctx.isDisabled,
      onFocus: _cache[2] || (_cache[2] = $event => _ctx.focus = true),
      onBlur: _cache[3] || (_cache[3] = $event => _ctx.focus = false),
      tabindex: "-1"
    }, null, 40
    /* PROPS, HYDRATE_EVENTS */
    , ["value", "name", "disabled"]), [[vue.vModelRadio, _ctx.radioValue]])], 2
    /* CLASS */
    ), vue.createVNode("span", {
      class: "el-radio__label",
      onKeydown: _cache[4] || (_cache[4] = vue.withModifiers(() => {}, ["stop"]))
    }, [vue.renderSlot(_ctx.$slots, "default", {}, () => [vue.createTextVNode(vue.toDisplayString(_ctx.label), 1
    /* TEXT */
    )])], 32
    /* HYDRATE_EVENTS */
    )], 10
    /* CLASS, PROPS */
    , ["aria-checked", "aria-disabled", "tabindex"]);
  }

  script$1r.render = render$1h;
  script$1r.__file = "src/components/Radio/src/Radio.vue";

  /* istanbul ignore next */

  script$1r.install = function (app) {
    app.component(script$1r.name, script$1r);
  };

  const props$5 = {
    label: [String, Number, Symbol, Boolean],
    disabled: Boolean,
    name: String
  };

  var script$1q = {
    name: 'ElRadioButton',
    componentName: 'ElRadioButton',
    props: props$5,

    setup(props) {
      const {
        radioGroup
      } = useCheckGroup();
      const {
        label,
        disabled
      } = vue.toRefs(props);
      const focus = vue.ref(false);
      let value = useModel$2(radioGroup);
      const handleChange = useChange(radioGroup, value);
      const {
        style,
        size,
        isDisabled
      } = useStyle$5({
        disabled,
        radioGroup
      });
      const {
        classes,
        isChecked,
        tabIndex
      } = useClasses$3({
        size,
        isDisabled,
        value,
        label,
        focus,
        radioGroup
      });
      return {
        value,
        handleChange,
        isDisabled,
        tabIndex,
        classes,
        isChecked,
        style
      };
    }

  };

  const useCheckGroup = () => {
    const {
      parent
    } = vue.getCurrentInstance();
    const isGroup = parent.type.name === 'ElRadioGroup';
    const radioGroup = isGroup ? parent : null;
    return {
      isGroup,
      radioGroup
    };
  };

  const useModel$2 = radioGroup => {
    const value = vue.ref(radioGroup === null || radioGroup === void 0 ? void 0 : radioGroup.props.modelValue);
    vue.watch(() => radioGroup === null || radioGroup === void 0 ? void 0 : radioGroup.props.modelValue, val => {
      value.value = val;
    });
    return value;
  };

  const useChange = (radioGroup, value) => {
    const handleChange = () => {
      radioGroup === null || radioGroup === void 0 ? void 0 : radioGroup.emit('update:modelValue', value.value);
      radioGroup === null || radioGroup === void 0 ? void 0 : radioGroup.emit('change', value.value);
    };

    return handleChange;
  };

  const useStyle$5 = ({
    disabled,
    radioGroup
  }) => {
    const globalConfig = useGlobalOptions();
    const isDisabled = vue.computed(() => {
      const elForm = vue.inject('elForm', {});
      return (disabled === null || disabled === void 0 ? void 0 : disabled.value) || (radioGroup === null || radioGroup === void 0 ? void 0 : radioGroup.props.disabled) || elForm.disabled;
    });
    const size = vue.computed(() => {
      const elFormItem = vue.inject('elFormItem', {});
      return (radioGroup === null || radioGroup === void 0 ? void 0 : radioGroup.props.size) || (elFormItem === null || elFormItem === void 0 ? void 0 : elFormItem.elFormItemSize) || globalConfig.size;
    });
    const style = vue.computed(() => {
      return {
        backgroundColor: (radioGroup === null || radioGroup === void 0 ? void 0 : radioGroup.props.fill) || '',
        borderColor: (radioGroup === null || radioGroup === void 0 ? void 0 : radioGroup.props.fill) || '',
        boxShadow: radioGroup !== null && radioGroup !== void 0 && radioGroup.props.fill ? `-1px 0 0 0 ${radioGroup === null || radioGroup === void 0 ? void 0 : radioGroup.props.fill}` : '',
        color: (radioGroup === null || radioGroup === void 0 ? void 0 : radioGroup.props.textColor) || ''
      };
    });
    return {
      isDisabled,
      size,
      style
    };
  };

  const useClasses$3 = ({
    size,
    isDisabled,
    focus,
    value,
    label,
    radioGroup
  }) => {
    const isChecked = vue.computed(() => {
      return value.value === label.value;
    });
    const tabIndex = vue.computed(() => {
      return isDisabled.value || radioGroup && value.value !== label.value ? -1 : 0;
    });
    const classes = vue.computed(() => {
      return [size.value ? 'el-radio-button--' + size.value : '', {
        'is-active': isChecked.value
      }, {
        'is-disabled': isDisabled.value
      }, {
        'is-focus': focus.value
      }];
    });
    return {
      isChecked,
      classes,
      tabIndex
    };
  };

  function render$1g(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("label", {
      class: ["el-radio-button", $setup.classes],
      role: "radio",
      "aria-checked": $setup.isChecked,
      "aria-disabled": $setup.isDisabled,
      tabindex: $setup.tabIndex,
      onKeydown: _cache[6] || (_cache[6] = vue.withKeys(vue.withModifiers($event => $setup.value = $setup.isDisabled ? $setup.value : _ctx.label, ["stop", "prevent"]), ["space"]))
    }, [vue.withDirectives(vue.createVNode("input", {
      class: "el-radio-button__orig-radio",
      type: "radio",
      onChange: _cache[1] || (_cache[1] = (...args) => $setup.handleChange && $setup.handleChange(...args)),
      value: _ctx.label,
      name: _ctx.name,
      "onUpdate:modelValue": _cache[2] || (_cache[2] = $event => $setup.value = $event),
      disabled: $setup.isDisabled,
      onFocus: _cache[3] || (_cache[3] = $event => _ctx.focus = true),
      onBlur: _cache[4] || (_cache[4] = $event => _ctx.focus = false),
      tabindex: "-1"
    }, null, 40
    /* PROPS, HYDRATE_EVENTS */
    , ["value", "name", "disabled"]), [[vue.vModelRadio, $setup.value]]), vue.createVNode("span", {
      class: "el-radio-button__inner",
      style: $setup.isChecked ? $setup.style : null,
      onKeydown: _cache[5] || (_cache[5] = vue.withModifiers(() => {}, ["stop"]))
    }, [vue.renderSlot(_ctx.$slots, "default", {}, () => [vue.createTextVNode(vue.toDisplayString(_ctx.label), 1
    /* TEXT */
    )])], 36
    /* STYLE, HYDRATE_EVENTS */
    )], 42
    /* CLASS, PROPS, HYDRATE_EVENTS */
    , ["aria-checked", "aria-disabled", "tabindex"]);
  }

  script$1q.render = render$1g;
  script$1q.__file = "src/components/RadioButton/src/RadioButton.vue";

  /* istanbul ignore next */

  script$1q.install = function (app) {
    app.component(script$1q.name, script$1q);
  };

  const props$4 = {
      modelValue: [String, Number, Symbol, Boolean],
      size: {
          type: String,
          validator(val) {
              return ['medium', 'small', 'mini', ''].includes(val);
          }
      },
      fill: {
          type: String,
          default: '#409EFF'
      },
      textColor: {
          type: String,
          default: '#ffffff'
      },
      disabled: Boolean
  };

  function mitt (n) {
    return {
      all: n = n || new Map(),
      on: function (t, e) {
        var i = n.get(t);
        i && i.push(e) || n.set(t, [e]);
      },
      off: function (t, e) {
        var i = n.get(t);
        i && i.splice(i.indexOf(e) >>> 0, 1);
      },
      emit: function (t, e) {
        (n.get(t) || []).slice().map(function (n) {
          n(e);
        }), (n.get("*") || []).slice().map(function (n) {
          n(t, e);
        });
      }
    };
  }

  const DISPATCH = 'dispatch';
  const BROADCAST = 'broadcast';
  const wrapper = Symbol('wrapper');
  const emitter = mitt();
  function useEmitter() {
    const currentComponentInstance = vue.getCurrentInstance();

    function on(type, handler) {
      const handleWrapper = e => {
        const {
          value,
          type,
          emitComponentInstance
        } = e;

        if (type === BROADCAST) {
          if (isChildComponent(currentComponentInstance, emitComponentInstance)) {
            handler && handler(...value);
          }
        } else if (type === DISPATCH) {
          if (isChildComponent(emitComponentInstance, currentComponentInstance)) {
            handler && handler(...value);
          }
        } else {
          handler && handler(...value);
        }
      }; // Save the real handler because the need to call off


      handler[wrapper] = handleWrapper;
      emitter.on(type, handleWrapper);
    }

    function broadcast(type, ...args) {
      emitter.emit(type, {
        type: BROADCAST,
        emitComponentInstance: currentComponentInstance,
        value: args
      });
    }

    function dispatch(type, ...args) {
      emitter.emit(type, {
        type: DISPATCH,
        emitComponentInstance: currentComponentInstance,
        value: args
      });
    }

    function off(type, handler) {
      emitter.off(type, handler[wrapper]);
    }

    function once(type, handler) {
      const handleOn = (...args) => {
        handler && handler(...args);
        off(type, handleOn);
      };

      on(type, handleOn);
    }

    return {
      on,
      broadcast,
      dispatch,
      off,
      once
    };
  }
  /**
   * check componentChild is componentParent child components
   * @param {*} componentChild
   * @param {*} componentParent
   */

  function isChildComponent(componentChild, componentParent) {
    const parentUId = componentParent.uid;

    while (componentChild && ((_componentChild = componentChild) === null || _componentChild === void 0 ? void 0 : (_componentChild$paren = _componentChild.parent) === null || _componentChild$paren === void 0 ? void 0 : _componentChild$paren.uid) !== parentUId) {
      var _componentChild, _componentChild$paren;

      componentChild = componentChild.parent;
    }

    return Boolean(componentChild);
  }

  var script$1p = vue.defineComponent({
    name: 'ElRadioGroup',
    props: props$4,
    emits: ['update:modelValue', 'change'],

    setup(props) {
      const {
        size,
        modelValue
      } = vue.toRefs(props);
      const globalConfig = useGlobalOptions();
      const elFormItem = vue.inject('elFormItem', {});
      const {
        dispatch
      } = useEmitter();
      vue.watch(modelValue, v => {
        dispatch('el.form.change', v);
      });
      const radioGroupSize = useRadioGroupSize({
        size,
        elFormItem,
        globalConfig
      });
      return {
        radioGroupSize
      };
    }

  });

  const useRadioGroupSize = ({
    size,
    elFormItem,
    globalConfig
  }) => {
    return vue.computed(() => {
      return (size === null || size === void 0 ? void 0 : size.value) || (elFormItem === null || elFormItem === void 0 ? void 0 : elFormItem.elFormItemSize) || globalConfig.size;
    });
  };

  const _hoisted_1$T = {
    class: "el-radio-group",
    role: "radiogroup"
  };
  function render$1f(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("div", _hoisted_1$T, [vue.renderSlot(_ctx.$slots, "default")]);
  }

  script$1p.render = render$1f;
  script$1p.__file = "src/components/RadioGroup/src/RadioGroup.vue";

  script$1p.install = function (app) {
    app.component(script$1p.name, script$1p);
  };

  /**
   * Make a map and return a function for checking if a key
   * is in that map.
   * IMPORTANT: all calls of this function must be prefixed with
   * \/\*#\_\_PURE\_\_\*\/
   * So that rollup can tree-shake them if necessary.
   */
  Object.freeze({}) ;
  Object.freeze([]) ;

  const onRE = /^on[^a-z]/;

  const isOn = key => onRE.test(key);

  const isArray$1 = Array.isArray;

  function usePropUtils() {
    return {
      isAfferentProp: isAfferentProp()
    };
  }

  function isAfferentProp() {
    // Used only for setuping or mounting
    const {
      vnode
    } = vue.getCurrentInstance();
    return propKey => {
      return typeof vnode.props[propKey] !== 'undefined';
    };
  }

  function useModel$1() {
    // core
    const {
      emit,
      props
    } = vue.getCurrentInstance();
    const elCheckboxGroup = vue.inject('elCheckboxGroup', {
      props: {}
    });
    const {
      dispatch
    } = useEmitter();
    const state = vue.reactive({
      modelValue: null // If the parent element is ChceckboxGroup use its modelValue

    });
    vue.watchEffect(() => {
      state.modelValue = elCheckboxGroup.props.modelValue || props.modelValue;
    });
    const model = vue.computed({
      get() {
        return state.modelValue; // BUG: if the Checkbox list and modelValue are an object, this causes the object element to be deleted.
        // Resolve: `isArray(modelValue) ? [...modelValue] : modelValue`, but doing so will invalidate the `checked` prop.
      },

      set({
        label,
        checked
      }) {
        if (label && isArray$1(model.value)) {
          // when modelValue or elCheckboxGroup.modeValue is array
          const modelValue = model.value;
          const labelIndex = modelValue.indexOf(label);
          labelIndex === -1 && checked === true && modelValue.push(label);
          labelIndex !== -1 && checked === false && modelValue.splice(labelIndex, 1);
          state.modelValue = modelValue;
          emit('update:modelValue', modelValue);
          dispatch('update:modelValue', modelValue);
        } else {
          const modelValue = checked ? props.trueLabel : props.falseLabel;
          state.modelValue = modelValue;
          emit('update:modelValue', modelValue);
        }
      }

    });

    async function handleChange() {
      await vue.nextTick();
      emit('change', model.value);
      dispatch('change', model.value);
    }

    return {
      model,
      handleChange
    };
  }
  function useAria() {
    const {
      props,
      vnode
    } = vue.getCurrentInstance();
    vue.onMounted(() => {
      if (props.indeterminate) {
        vnode.el.setAttribute('aria-controls', props.controls);
      }
    });
  }
  function useCheckSelected({
    model
  }) {
    const {
      props
    } = vue.getCurrentInstance();
    const {
      isAfferentProp
    } = usePropUtils();
    const checkbox = vue.ref(null);
    vue.onMounted(() => {
      isAfferentProp('checked') && (model.value = {
        label: props.label,
        checked: props.checked
      });
    });
    const isChecked = vue.computed(() => {
      const _isChecked = isArray$1(model.value) ? model.value.indexOf(props.label) !== -1 : model.value === props.trueLabel;

      checkbox.value && (checkbox.value.checked = _isChecked);
      return _isChecked;
    });
    return {
      isChecked,
      checkbox
    };
  }
  function useSize$1() {
    const elCheckboxGroup = vue.inject('elCheckboxGroup', {
      props: {},
      proxy: {}
    });
    const {
      props,
      proxy
    } = vue.getCurrentInstance();
    const checkboxSize = vue.computed(() => {
      return props.size || elCheckboxGroup.proxy.checkboxGroupSize || (proxy.$ELEMENT || {}).size;
    });
    return checkboxSize;
  }
  function useLimit({
    model
  }) {
    const elCheckboxGroup = vue.inject('elCheckboxGroup', {
      props: {},
      proxy: {}
    });
    const {
      props
    } = vue.getCurrentInstance();
    const isLimit = vue.computed(() => {
      if (elCheckboxGroup.props.modelValue) {
        // if elCheckboxGroup exist
        const modelValueLength = elCheckboxGroup.props.modelValue.length;
        const min = elCheckboxGroup.props.min;
        const max = elCheckboxGroup.props.max;
        return modelValueLength <= min && model.value.indexOf(props.label) !== -1 || modelValueLength >= max && model.value.indexOf(props.label) === -1;
      } else {
        return false;
      }
    });
    return isLimit;
  }
  function useDisabled$1({
    isLimit
  }) {
    const elCheckboxGroup = vue.inject('elCheckboxGroup', {
      props: {},
      proxy: {}
    });
    const {
      props
    } = vue.getCurrentInstance();
    const isDisabled = vue.computed(() => {
      return props.disabled || elCheckboxGroup.proxy.checkboxGroupDisabled || isLimit.value;
    });
    return isDisabled;
  }
  function useBorder() {
    const elCheckboxGroup = vue.inject('elCheckboxGroup', {
      props: {},
      proxy: {}
    });
    const {
      props
    } = vue.getCurrentInstance();
    const isBorder = vue.computed(() => {
      return props.border || elCheckboxGroup.props.border;
    });
    return isBorder;
  }
  function useActiveStyle() {
    const elCheckboxGroup = vue.inject('elCheckboxGroup', {
      props: {},
      proxy: {}
    });
    return {
      backgroundColor: elCheckboxGroup.props.fill || '',
      borderColor: elCheckboxGroup.props.fill || '',
      color: elCheckboxGroup.props.textColor || '',
      'box-shadow': '-1px 0 0 0 ' + elCheckboxGroup.props.fill
    };
  }

  var script$1o = {
    name: 'ElCheckbox',
    props: {
      modelValue: [String, Number, Boolean, Symbol, Array],
      label: [String, Number, Boolean, Symbol],
      indeterminate: Boolean,
      disabled: Boolean,
      checked: Boolean,
      name: String,
      trueLabel: {
        type: [String, Number, Boolean],
        default: true
      },
      falseLabel: {
        type: [String, Number, Boolean],
        default: false
      },
      id: String
      /* 当indeterminate为真时，为controls提供相关连的checkbox的id，表明元素间的控制关系 */
      ,
      controls: String
      /* 当indeterminate为真时，为controls提供相关连的checkbox的id，表明元素间的控制关系 */
      ,
      border: Boolean,
      size: String
    },
    emits: ['update:modelValue', 'change'],

    setup() {
      const state = vue.reactive({
        focus: false
      });
      useAria();
      const {
        model,
        handleChange
      } = useModel$1();
      const isLimit = useLimit({
        model
      });
      const {
        isChecked,
        checkbox
      } = useCheckSelected({
        model
      });
      const checkboxSize = useSize$1();
      const isDisabled = useDisabled$1({
        isLimit
      });
      const isBorder = useBorder();
      return { ...vue.toRefs(state),
        checkbox,
        model,
        isDisabled,
        checkboxSize,
        isChecked,
        handleChange,
        isBorder
      };
    }

  };

  const _hoisted_1$S = /*#__PURE__*/vue.createVNode("span", {
    class: "el-checkbox__inner"
  }, null, -1
  /* HOISTED */
  );

  const _hoisted_2$A = {
    key: 0,
    class: "el-checkbox__label"
  };
  function render$1e(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("label", {
      class: ["el-checkbox", [$setup.isBorder && $setup.checkboxSize ? 'el-checkbox--' + $setup.checkboxSize : '', {
        'is-disabled': $setup.isDisabled
      }, {
        'is-bordered': $setup.isBorder
      }, {
        'is-checked': $setup.isChecked
      }]],
      role: "checkbox",
      id: $props.id,
      "aria-checked": $setup.isChecked,
      "aria-disabled": $setup.isDisabled
    }, [vue.createVNode("span", {
      class: ["el-checkbox__input", {
        'is-disabled': $setup.isDisabled,
        'is-checked': $setup.isChecked,
        'is-indeterminate': $props.indeterminate,
        'is-focus': _ctx.focus
      }],
      tabindex: $props.indeterminate ? 0 : false,
      role: $props.indeterminate ? 'checkbox' : false,
      "aria-checked": $props.indeterminate ? 'mixed' : false
    }, [_hoisted_1$S, vue.createVNode("input", {
      class: "el-checkbox__original",
      type: "checkbox",
      ref: "checkbox",
      "aria-hidden": $props.indeterminate ? 'true' : 'false',
      name: $props.name,
      disabled: $setup.isDisabled,
      "true-value": $props.trueLabel,
      "false-value": $props.falseLabel,
      value: $props.label,
      onChange: _cache[1] || (_cache[1] = (...args) => $setup.handleChange && $setup.handleChange(...args)),
      onInput: _cache[2] || (_cache[2] = $event => $setup.model = {
        label: $props.label,
        checked: $event.target.checked
      }),
      onFocus: _cache[3] || (_cache[3] = $event => _ctx.focus = true),
      onBlur: _cache[4] || (_cache[4] = $event => _ctx.focus = false)
    }, null, 40
    /* PROPS, HYDRATE_EVENTS */
    , ["aria-hidden", "name", "disabled", "true-value", "false-value", "value"])], 10
    /* CLASS, PROPS */
    , ["tabindex", "role", "aria-checked"]), _ctx.$slots.default || $props.label ? (vue.openBlock(), vue.createBlock("span", _hoisted_2$A, [vue.renderSlot(_ctx.$slots, "default"), !_ctx.$slots.default ? (vue.openBlock(), vue.createBlock(vue.Fragment, {
      key: 0
    }, [vue.createTextVNode(vue.toDisplayString($props.label), 1
    /* TEXT */
    )], 64
    /* STABLE_FRAGMENT */
    )) : vue.createCommentVNode("v-if", true)])) : vue.createCommentVNode("v-if", true)], 10
    /* CLASS, PROPS */
    , ["id", "aria-checked", "aria-disabled"]);
  }

  script$1o.render = render$1e;
  script$1o.__file = "packages/checkbox/Checkbox.vue";

  /* istanbul ignore next */

  script$1o.install = function (app) {
    app.component(script$1o.name, script$1o);
  };

  var script$1n = {
    name: 'ElCheckboxButton',
    props: {
      modelValue: [String, Number, Boolean, Symbol, Array],
      label: [String, Number, Boolean, Symbol],
      indeterminate: Boolean,
      disabled: Boolean,
      checked: Boolean,
      name: String,
      trueLabel: {
        type: [String, Number, Boolean],
        default: true
      },
      falseLabel: {
        type: [String, Number, Boolean],
        default: false
      },
      id: String
      /* 当indeterminate为真时，为controls提供相关连的checkbox的id，表明元素间的控制关系 */
      ,
      controls: String
      /* 当indeterminate为真时，为controls提供相关连的checkbox的id，表明元素间的控制关系 */
      ,
      border: Boolean,
      size: String
    },
    emits: ['update:modelValue', 'change'],

    setup() {
      const state = vue.reactive({
        focus: false
      });
      useAria();
      const {
        model,
        handleChange
      } = useModel$1();
      const isLimit = useLimit({
        model
      });
      const {
        isChecked,
        checkbox
      } = useCheckSelected({
        model
      });
      const checkboxSize = useSize$1();
      const isDisabled = useDisabled$1({
        isLimit
      });
      const activeStyle = useActiveStyle();
      return { ...vue.toRefs(state),
        checkbox,
        model,
        isDisabled,
        checkboxSize,
        isChecked,
        handleChange,
        activeStyle
      };
    }

  };

  function render$1d(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("label", {
      class: ["el-checkbox-button", [$setup.checkboxSize ? 'el-checkbox-button--' + $setup.checkboxSize : '', {
        'is-disabled': $setup.isDisabled
      }, {
        'is-checked': $setup.isChecked
      }, {
        'is-focus': _ctx.focus
      }]],
      role: "checkbox",
      id: $props.id,
      "aria-checked": $setup.isChecked,
      "aria-disabled": $setup.isDisabled
    }, [vue.createVNode("input", {
      class: "el-checkbox-button__original",
      type: "checkbox",
      ref: "checkbox",
      "aria-hidden": $props.indeterminate ? 'true' : 'false',
      name: $props.name,
      disabled: $setup.isDisabled,
      "true-value": $props.trueLabel,
      "false-value": $props.falseLabel,
      modelValue: $setup.model,
      value: $props.label,
      onChange: _cache[1] || (_cache[1] = (...args) => $setup.handleChange && $setup.handleChange(...args)),
      onInput: _cache[2] || (_cache[2] = $event => $setup.model = {
        label: $props.label,
        checked: $event.target.checked
      }),
      onFocus: _cache[3] || (_cache[3] = $event => _ctx.focus = true),
      onBlur: _cache[4] || (_cache[4] = $event => _ctx.focus = false)
    }, null, 40
    /* PROPS, HYDRATE_EVENTS */
    , ["aria-hidden", "name", "disabled", "true-value", "false-value", "modelValue", "value"]), _ctx.$slots.default || $props.label ? (vue.openBlock(), vue.createBlock("span", {
      key: 0,
      class: "el-checkbox-button__inner",
      style: $setup.isChecked ? $setup.activeStyle : null
    }, [vue.renderSlot(_ctx.$slots, "default", {}, () => [vue.createTextVNode(vue.toDisplayString($props.label), 1
    /* TEXT */
    )])], 4
    /* STYLE */
    )) : vue.createCommentVNode("v-if", true)], 10
    /* CLASS, PROPS */
    , ["id", "aria-checked", "aria-disabled"]);
  }

  script$1n.render = render$1d;
  script$1n.__file = "packages/checkbox-button/CheckboxButton.vue";

  /* istanbul ignore next */

  script$1n.install = function (app) {
    app.component(script$1n.name, script$1n);
  };

  var script$1m = {
    name: 'ElCheckboxGroup',
    props: {
      modelValue: Array,
      disabled: Boolean,
      min: Number,
      max: Number,
      size: String,
      fill: String,
      textColor: String,
      border: Boolean
    },
    emits: ['update:modelValue', 'change'],

    setup(props, {
      emit
    }) {
      const elForm = vue.inject('elForm', {
        props: {},
        ctx: {}
      });
      const elFormItem = vue.inject('elFormItem', {});
      vue.provide('elCheckboxGroup', vue.getCurrentInstance());
      const {
        dispatch,
        on
      } = useEmitter();
      const checkboxGroupSize = vue.computed(() => {
        return props.size || elFormItem.elFormItemSize;
      });
      const checkboxGroupDisabled = vue.computed(() => {
        return props.disabled || elForm.disabled;
      });
      on('update:modelValue', v => {
        emit('update:modelValue', v);
        dispatch('el.form.change', v);
      });
      on('change', v => {
        emit('change', v);
      });
      return {
        checkboxGroupSize,
        checkboxGroupDisabled
      };
    }

  };

  const _hoisted_1$R = {
    class: "el-checkbox-group",
    role: "group",
    "aria-label": "checkbox-group"
  };
  function render$1c(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("div", _hoisted_1$R, [vue.renderSlot(_ctx.$slots, "default")]);
  }

  script$1m.render = render$1c;
  script$1m.__file = "packages/checkbox-group/CheckboxGroup.vue";

  /* istanbul ignore next */

  script$1m.install = function (app) {
    app.component(script$1m.name, script$1m);
  };

  const props$3 = {
    showWordLimit: {
      type: Boolean,
      default: false
    },
    modelValue: {
      type: [String, Number],
      default: ''
    },
    clearable: {
      type: Boolean,
      default: false
    },
    showPassword: {
      type: Boolean,
      default: false
    },
    prefixIcon: {
      type: String
    },
    suffixIcon: {
      type: String
    },
    validateEvent: {
      type: Boolean,
      default: true
    },
    type: {
      type: String,
      default: 'text'
    },
    size: {
      type: String,
      validator: function (value) {
        return ['medium', 'small', 'mini', ''].includes(value);
      }
    },
    autosize: {
      type: [Boolean, Object],
      default: false
    },
    resize: {
      type: String
    }
  };

  let hiddenTextarea;
  const HIDDEN_STYLE = `
  height:0 !important;
  visibility:hidden !important;
  overflow:hidden !important;
  position:absolute !important;
  z-index:-1000 !important;
  top:0 !important;
  right:0 !important
`;
  const CONTEXT_STYLE = ['letter-spacing', 'line-height', 'padding-top', 'padding-bottom', 'font-family', 'font-weight', 'font-size', 'text-rendering', 'text-transform', 'width', 'text-indent', 'padding-left', 'padding-right', 'border-width', 'box-sizing'];

  function calculateNodeStyling(targetElement) {
    const style = window.getComputedStyle(targetElement);
    const boxSizing = style.getPropertyValue('box-sizing');
    const paddingSize = parseFloat(style.getPropertyValue('padding-bottom')) + parseFloat(style.getPropertyValue('padding-top'));
    const borderSize = parseFloat(style.getPropertyValue('border-bottom-width')) + parseFloat(style.getPropertyValue('border-top-width'));
    const contextStyle = CONTEXT_STYLE.map(name => `${name}:${style.getPropertyValue(name)}`).join(';');
    return {
      contextStyle,
      paddingSize,
      borderSize,
      boxSizing
    };
  }

  function calcTextareaHeight(targetElement, minRows = 1, maxRows = null) {
    if (!hiddenTextarea) {
      hiddenTextarea = document.createElement('textarea');
      document.body.appendChild(hiddenTextarea);
    }

    const {
      paddingSize,
      borderSize,
      boxSizing,
      contextStyle
    } = calculateNodeStyling(targetElement);
    hiddenTextarea.setAttribute('style', `${contextStyle};${HIDDEN_STYLE}`);
    hiddenTextarea.value = targetElement.value || targetElement.placeholder || '';
    let height = hiddenTextarea.scrollHeight;
    const result = {};

    if (boxSizing === 'border-box') {
      height = height + borderSize;
    } else if (boxSizing === 'content-box') {
      height = height - paddingSize;
    }

    hiddenTextarea.value = '';
    const singleRowHeight = hiddenTextarea.scrollHeight - paddingSize;

    if (minRows !== null) {
      let minHeight = singleRowHeight * minRows;

      if (boxSizing === 'border-box') {
        minHeight = minHeight + paddingSize + borderSize;
      }

      height = Math.max(minHeight, height);
      result.minHeight = `${minHeight}px`;
    }

    if (maxRows !== null) {
      let maxHeight = singleRowHeight * maxRows;

      if (boxSizing === 'border-box') {
        maxHeight = maxHeight + paddingSize + borderSize;
      }

      height = Math.min(maxHeight, height);
    }

    result.height = `${height}px`;
    hiddenTextarea.parentNode && hiddenTextarea.parentNode.removeChild(hiddenTextarea);
    hiddenTextarea = null;
    return result;
  }

  const useClass$2 = (inputSize, inputExceed, props, attrs, slots) => {
    return vue.computed(() => {
      const classes = [inputSize.value ? 'el-input--' + inputSize.value : '', props.type === 'textarea' ? 'el-textarea' : 'el-input'];

      if (attrs.disabled) {
        classes.push('is-disabled');
      }

      if (inputExceed.value) {
        classes.push('is-exceed');
      }

      if (slots.prepend || slots.append) {
        classes.push('el-input-group');
      }

      if (slots.append) {
        classes.push('el-input-group--append');
      }

      if (slots.prepend) {
        classes.push('el-input-group--prepend');
      }

      if (slots.prefix || props.prefixIcon) {
        classes.push('el-input--prefix');
      }

      if (slots.suffix || props.suffixIcon || slots.suffixIcon || attrs.clearable || attrs.showPassword) {
        classes.push('el-input--suffix');
      }

      return classes;
    });
  };
  const useInput = (props, cxt, textarea) => {
    const input = vue.ref(null);
    const elFormItem = vue.inject('elFormItem', {});
    const elFormChange = vue.inject('elForm.change', () => {});
    const {
      modelValue,
      size,
      suffixIcon,
      clearable,
      showPassword,
      showWordLimit
    } = vue.toRefs(props);
    const nativeInputValue = vue.computed(() => {
      return modelValue.value === null || modelValue.value === undefined ? '' : String(modelValue.value);
    });
    const textLength = vue.computed(() => {
      if (typeof modelValue.value === 'number') {
        return String(modelValue.value).length >= Number(cxt.attrs.maxlength) ? Number(cxt.attrs.maxlength) : String(modelValue.value).length;
      }

      return modelValue.value.length >= Number(cxt.attrs.maxlength) ? Number(cxt.attrs.maxlength) : modelValue.value.length;
    });
    const elFormItemSize = vue.computed(() => {
      return elFormItem.elFormItemSize || '';
    });
    const inputSize = vue.computed(() => {
      return (size === null || size === void 0 ? void 0 : size.value) || elFormItemSize.value;
    });
    const inputExceed = vue.computed(() => {
      var _props$modelValue;

      return ((_props$modelValue = props.modelValue) === null || _props$modelValue === void 0 ? void 0 : _props$modelValue.length) >= Number(cxt.attrs.maxlength) ? true : false;
    });

    const getInput = () => vue.computed({
      get: () => input.value ? input.value : textarea.value,
      set: value => {
        if (input !== null && input !== void 0 && input.value) {
          input.value.value = value;
        }

        if (textarea !== null && textarea !== void 0 && textarea.value) {
          textarea.value.value = value;
        }
      }
    });

    const clearValue = () => {
      cxt.emit('update:modelValue', '');
    };

    const setNativeInputValue = () => {
      const input = getInput();
      if (!input) return;
      input.value = nativeInputValue.value;
    };

    const getSuffixVisible = vue.computed(() => {
      return cxt.slots.suffix || (suffixIcon === null || suffixIcon === void 0 ? void 0 : suffixIcon.value) || (clearable === null || clearable === void 0 ? void 0 : clearable.value) || (showPassword === null || showPassword === void 0 ? void 0 : showPassword.value) || (showWordLimit === null || showWordLimit === void 0 ? void 0 : showWordLimit.value);
    });
    vue.onMounted(() => {
      setNativeInputValue(nativeInputValue.value);
    });
    vue.watch(() => props.modelValue, () => {
      setNativeInputValue();

      if (props.validateEvent) {
        elFormChange();
      }
    });
    return {
      input,
      getInput,
      nativeInputValue,
      textLength,
      clearValue,
      inputSize,
      getSuffixVisible,
      inputExceed
    };
  };
  const useInputEvent = emit => {
    const handleInput = event => {
      emit('update:modelValue', event.target.value);
      emit('input', event.target.value);
    };

    const handleFocus = event => {
      emit('focus', event);
    };

    const handleBlur = event => emit('blur', event);

    const handleClear = () => {
      emit('update:modelValue', '');
      emit('clear');
    };

    const onChange = event => {
      emit('change', event.target.value);
    };

    return {
      handleInput,
      handleFocus,
      handleBlur,
      handleClear,
      onChange
    };
  };
  const useInputMethod = element => {
    const focus = () => {
      element.value.focus();
    };

    const blur = () => {
      element.value.blur();
    };

    const select = () => {
      element.value.select();
    };

    return {
      focus,
      blur,
      select
    };
  };
  const useTextarea = props => {
    const textarea = vue.ref(null);
    const {
      autosize,
      type,
      resize
    } = vue.toRefs(props);
    const state = vue.reactive({
      textareaCalcStyle: {}
    });
    const textareaStyle = vue.computed(() => {
      return Object.assign({}, state.textareaCalcStyle, {
        resize: resize === null || resize === void 0 ? void 0 : resize.value
      });
    });
    vue.watch(() => props.modelValue, () => resizeTextarea());

    const resizeTextarea = () => {
      if (type.value !== 'textarea') return;

      if (!autosize.value) {
        state.textareaCalcStyle = {
          minHeight: calcTextareaHeight(textarea.value).minHeight
        };
        return;
      }

      const minRows = autosize.value.minRows;
      const maxRows = autosize.value.maxRows;
      state.textareaCalcStyle = calcTextareaHeight(textarea.value, minRows, maxRows);
    };

    return {
      textarea,
      textareaStyle,
      resizeTextarea
    };
  };

  var script$1l = vue.defineComponent({
    name: 'ElInput',
    inheritAttrs: false,
    props: props$3,
    emits: ['blur', 'focus', 'change', 'input', 'clear', 'update:modelValue'],

    setup(props, cxt) {
      const state = vue.reactive({
        isVisiablePassword: false
      });
      const {
        inputSize
      } = useInput(props, cxt);
      const {
        attrs,
        emit
      } = cxt;
      const {
        textarea,
        textareaStyle
      } = useTextarea(props);
      const {
        input,
        textLength,
        getSuffixVisible,
        inputExceed,
        getInput
      } = useInput(props, cxt, textarea);
      const classes = useClass$2(inputSize, inputExceed, props, cxt.attrs, cxt.slots);
      const {
        handleInput,
        handleFocus,
        handleBlur,
        handleClear,
        onChange
      } = useInputEvent(emit);
      const {
        focus,
        select,
        blur
      } = useInputMethod(getInput());

      const togglePassword = () => state.isVisiablePassword = !state.isVisiablePassword;

      return {
        isVisiablePassword: vue.toRef(state, 'isVisiablePassword'),
        focus,
        select,
        blur,
        handleBlur,
        handleInput,
        handleFocus,
        togglePassword,
        onChange,
        getSuffixVisible,
        attrs,
        input,
        textarea,
        handleClear,
        textLength,
        textareaStyle,
        classes
      };
    }

  });

  const _hoisted_1$Q = {
    key: 0,
    class: "el-input-group__prepend"
  };
  const _hoisted_2$z = {
    key: 1,
    class: "el-input__prefix"
  };
  const _hoisted_3$s = {
    key: 2,
    class: "el-input__suffix"
  };
  const _hoisted_4$h = {
    class: "el-input__suffix-inner"
  };
  const _hoisted_5$d = {
    key: 3,
    class: "el-input__count"
  };
  const _hoisted_6$7 = {
    class: "el-input__count-inner"
  };
  const _hoisted_7$4 = {
    key: 3,
    class: "el-input-group__append"
  };
  const _hoisted_8$3 = {
    key: 0,
    class: "el-input__count"
  };
  function render$1b(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("div", {
      style: _ctx.$attrs.style,
      class: _ctx.classes
    }, [_ctx.type !== 'textarea' ? (vue.openBlock(), vue.createBlock(vue.Fragment, {
      key: 0
    }, [_ctx.$slots.prepend ? (vue.openBlock(), vue.createBlock("div", _hoisted_1$Q, [vue.renderSlot(_ctx.$slots, "prepend")])) : vue.createCommentVNode("v-if", true), vue.createVNode("input", vue.mergeProps({
      class: "el-input__inner",
      ref: "input"
    }, _ctx.$attrs, {
      onBlur: _cache[1] || (_cache[1] = (...args) => _ctx.handleBlur && _ctx.handleBlur(...args)),
      onFocus: _cache[2] || (_cache[2] = (...args) => _ctx.handleFocus && _ctx.handleFocus(...args)),
      onChange: _cache[3] || (_cache[3] = (...args) => _ctx.onChange && _ctx.onChange(...args)),
      type: _ctx.showPassword ? _ctx.isVisiablePassword ? 'text' : 'password' : _ctx.type,
      onInput: _cache[4] || (_cache[4] = (...args) => _ctx.handleInput && _ctx.handleInput(...args))
    }), null, 16
    /* FULL_PROPS */
    , ["type"]), _ctx.$slots.prefix || _ctx.prefixIcon ? (vue.openBlock(), vue.createBlock("span", _hoisted_2$z, [vue.renderSlot(_ctx.$slots, "prefix"), _ctx.prefixIcon ? (vue.openBlock(), vue.createBlock("i", {
      key: 0,
      class: ["el-input__icon", _ctx.prefixIcon]
    }, null, 2
    /* CLASS */
    )) : vue.createCommentVNode("v-if", true)])) : vue.createCommentVNode("v-if", true), _ctx.getSuffixVisible ? (vue.openBlock(), vue.createBlock("span", _hoisted_3$s, [vue.createVNode("span", _hoisted_4$h, [!_ctx.clearable || !_ctx.showPassword || !_ctx.showWordLimit ? (vue.openBlock(), vue.createBlock(vue.Fragment, {
      key: 0
    }, [vue.renderSlot(_ctx.$slots, "suffix"), _ctx.suffixIcon ? (vue.openBlock(), vue.createBlock("i", {
      key: 0,
      class: ["el-input__icon", _ctx.suffixIcon]
    }, null, 2
    /* CLASS */
    )) : vue.createCommentVNode("v-if", true)], 64
    /* STABLE_FRAGMENT */
    )) : vue.createCommentVNode("v-if", true), _ctx.clearable ? (vue.openBlock(), vue.createBlock("i", {
      key: 1,
      class: "el-input__icon el-icon-circle-close el-input__clear",
      onMousedown: _cache[5] || (_cache[5] = vue.withModifiers(() => {}, ["prevent"])),
      onClick: _cache[6] || (_cache[6] = vue.withModifiers((...args) => _ctx.handleClear && _ctx.handleClear(...args), ["prevent"]))
    }, null, 32
    /* HYDRATE_EVENTS */
    )) : vue.createCommentVNode("v-if", true), _ctx.showPassword ? (vue.openBlock(), vue.createBlock("i", {
      key: 2,
      class: "el-input__icon el-icon-view el-input__clear",
      onMousedown: _cache[7] || (_cache[7] = vue.withModifiers(() => {}, ["prevent"])),
      onClick: _cache[8] || (_cache[8] = vue.withModifiers((...args) => _ctx.togglePassword && _ctx.togglePassword(...args), ["prevent"]))
    }, null, 32
    /* HYDRATE_EVENTS */
    )) : vue.createCommentVNode("v-if", true), _ctx.showWordLimit ? (vue.openBlock(), vue.createBlock("span", _hoisted_5$d, [vue.createVNode("span", _hoisted_6$7, vue.toDisplayString(_ctx.textLength) + "/" + vue.toDisplayString(_ctx.$attrs.maxlength), 1
    /* TEXT */
    )])) : vue.createCommentVNode("v-if", true)])])) : vue.createCommentVNode("v-if", true), vue.createCommentVNode(" 后置元素 "), _ctx.$slots.append ? (vue.openBlock(), vue.createBlock("div", _hoisted_7$4, [vue.renderSlot(_ctx.$slots, "append")])) : vue.createCommentVNode("v-if", true)], 64
    /* STABLE_FRAGMENT */
    )) : (vue.openBlock(), vue.createBlock(vue.Fragment, {
      key: 1
    }, [vue.createVNode("textarea", vue.mergeProps({
      class: "el-textarea__inner",
      ref: "textarea",
      style: _ctx.textareaStyle
    }, _ctx.$attrs, {
      onInput: _cache[9] || (_cache[9] = (...args) => _ctx.handleInput && _ctx.handleInput(...args)),
      onBlur: _cache[10] || (_cache[10] = (...args) => _ctx.handleBlur && _ctx.handleBlur(...args)),
      onFocus: _cache[11] || (_cache[11] = (...args) => _ctx.handleFocus && _ctx.handleFocus(...args)),
      onChange: _cache[12] || (_cache[12] = (...args) => _ctx.onChange && _ctx.onChange(...args))
    }), null, 16
    /* FULL_PROPS */
    ), _ctx.showWordLimit ? (vue.openBlock(), vue.createBlock("span", _hoisted_8$3, vue.toDisplayString(_ctx.modelValue.length) + "/" + vue.toDisplayString(_ctx.$attrs.maxlength), 1
    /* TEXT */
    )) : vue.createCommentVNode("v-if", true)], 64
    /* STABLE_FRAGMENT */
    ))], 6
    /* CLASS, STYLE */
    );
  }

  script$1l.render = render$1b;
  script$1l.__file = "src/components/Input/src/Input.vue";

  /* istanbul ignore next */

  script$1l.install = function (app) {
    app.component(script$1l.name, script$1l);
  };

  function useFocus(ref) {
    return function focus() {
      if (vue.isRef(ref)) {
        ref.value.focus();
      } else {
        const {
          proxy
        } = vue.getCurrentInstance();
        proxy.$refs[ref].focus();
      }
    };
  }

  const INTERVAL_TIME = 100;
  var RepeatClick = {
    beforeMount(el, binding) {
      let startTime;
      let intervalId;

      const callHandler = () => binding.value && binding.value();

      const clearIntervalHandler = () => {
        if (intervalId) {
          clearInterval(intervalId);
          intervalId = null;
        }
      };

      const isMainKey = e => {
        // 0：主按键，通常指鼠标左键或默认值
        return e.button === 0;
      };

      const handleMouseup = () => {
        if (Date.now() - startTime < INTERVAL_TIME) {
          callHandler();
        }

        clearIntervalHandler();
      };

      const handleMousedown = e => {
        if (!isMainKey(e)) return;
        startTime = Date.now();
        once(document, 'mouseup', handleMouseup);
        clearIntervalHandler();
        intervalId = setInterval(callHandler, INTERVAL_TIME);
      };

      on(el, 'mousedown', handleMousedown);
    }

  };

  var script$1k = {
    name: 'ElInputNumber',
    directives: {
      repeatClick: RepeatClick
    },
    components: {
      ElInput: script$1l
    },
    props: {
      step: {
        type: Number,
        default: 1
      },
      stepStrictly: {
        type: Boolean,
        default: false
      },
      max: {
        type: Number,
        default: Infinity
      },
      min: {
        type: Number,
        default: -Infinity
      },
      modelValue: {
        type: Number,
        default: 0
      },
      disabled: Boolean,
      size: {
        default: '',
        type: String
      },
      controls: {
        type: Boolean,
        default: true
      },
      controlsPosition: {
        type: String,
        default: ''
      },
      name: String,
      label: String,
      placeholder: String,
      precision: {
        type: Number,

        validator(val) {
          return val >= 0 && val === parseInt(val, 10);
        },

        default: undefined
      }
    },
    emits: ['change', 'update:modelValue', 'blur', 'focus'],

    setup(props, {
      emit
    }) {
      const {
        proxy
      } = vue.getCurrentInstance();
      const {
        step,
        stepStrictly,
        max,
        min,
        modelValue,
        disabled,
        size,
        controls,
        controlsPosition,
        precision
      } = vue.toRefs(props);
      const state = vue.reactive({
        currentValue: 0,
        userInput: null
      });
      const focus = useFocus('input');

      const getPrecision = value => {
        if (value === undefined) return 0;
        const valueString = value.toString();
        const dotPosition = valueString.indexOf('.');
        let precision = 0;

        if (dotPosition !== -1) {
          precision = valueString.length - dotPosition - 1;
        }

        return precision;
      };

      const setCurrentValue = newVal => {
        const oldVal = state.currentValue;

        if (typeof newVal === 'number' && precision.value !== undefined) {
          newVal = toPrecision(newVal, precision.value);
        }

        if (newVal >= max.value) newVal = max.value;
        if (newVal <= min.value) newVal = min.value;
        if (oldVal === newVal) return;
        state.userInput = null;
        emit('update:modelValue', newVal);
        emit('change', newVal, oldVal);
        state.currentValue = newVal;
      };

      const toPrecision = (num, precision) => {
        if (precision === undefined) precision = numPrecision.value;
        return parseFloat(Math.round(num * Math.pow(10, precision)) / Math.pow(10, precision));
      };

      const _decrease = (val, step) => {
        if (typeof val !== 'number' && val !== undefined) {
          return state.currentValue;
        }

        const precisionFactor = Math.pow(10, numPrecision.value);
        return toPrecision((precisionFactor * val - precisionFactor * step) / precisionFactor);
      };

      const _increase = (val, step) => {
        if (typeof val !== 'number' && val !== undefined) {
          return state.currentValue;
        }

        const precisionFactor = Math.pow(10, numPrecision.value); // Solve the accuracy problem of JS decimal calculation by converting the value to integer.

        return toPrecision((precisionFactor * val + precisionFactor * step) / precisionFactor);
      };

      const minDisabled = vue.computed(() => {
        return _decrease(modelValue.value, step.value) < min.value;
      });
      const maxDisabled = vue.computed(() => {
        return _increase(modelValue.value, step.value) > max.value;
      });
      const numPrecision = vue.computed(() => {
        const stepPrecision = getPrecision(step.value);

        if (precision.value !== undefined) {
          if (stepPrecision > precision.value) {
            console.warn('[Element Warn][InputNumber]precision should not be less than the decimal places of step');
          }

          return precision.value;
        } else {
          return Math.max(getPrecision(modelValue.value), stepPrecision);
        }
      });
      const controlsAtRight = vue.computed(() => controls.value && controlsPosition.value === 'right');

      const _elFormItemSize = vue.computed(() => {
        const elFormItem = vue.inject('elFormItem', {});
        return (elFormItem || {}).elFormItemSize;
      });

      const inputNumberSize = vue.computed(() => {
        return size.value || _elFormItemSize.value || (proxy.$ELEMENT || {}).size;
      });
      const inputNumberDisabled = vue.computed(() => {
        const elForm = vue.inject('elForm', {});
        return disabled.value || !!(elForm || {}).disabled;
      });
      const displayValue = vue.computed({
        get: () => {
          if (state.userInput !== null) {
            return state.userInput;
          }

          let currentValue = state.currentValue;

          if (typeof currentValue === 'number') {
            if (stepStrictly.value) {
              const stepPrecision = getPrecision(step.value);
              const precisionFactor = Math.pow(10, stepPrecision);
              currentValue = Math.round(currentValue / step.value) * precisionFactor * step.value / precisionFactor;
            }

            if (precision.value !== undefined) {
              currentValue = currentValue.toFixed(precision.value);
            }
          }

          return currentValue;
        },
        set: () => {
          return state.currentValue;
        }
      });

      const increase = () => {
        if (inputNumberDisabled.value || maxDisabled.value) return;
        const value = modelValue.value || 0;

        const newVal = _increase(value, step.value);

        setCurrentValue(newVal);
      };

      const decrease = () => {
        if (inputNumberDisabled.value || minDisabled.value) return;
        const value = modelValue.value || 0;

        const newVal = _decrease(value, step.value);

        setCurrentValue(newVal);
      };

      const handleInput = value => {
        state.userInput = value;
      };

      const handleInputChange = value => {
        const newVal = value === '' ? undefined : Number(value);

        if (!isNaN(newVal) || value === '') {
          setCurrentValue(newVal);
        }

        state.userInput = null;
      };

      vue.onMounted(() => {
        const {
          refs
        } = vue.getCurrentInstance();
        const innerInput = refs.input.$el && refs.input.$refs.input;
        innerInput.setAttribute('role', 'spinbutton');
        innerInput.setAttribute('aria-valuemax', max.value);
        innerInput.setAttribute('aria-valuemin', min.value);
        innerInput.setAttribute('aria-valuenow', state.currentValue);
        innerInput.setAttribute('aria-disabled', inputNumberDisabled.value);
      });
      vue.onUpdated(() => {
        const {
          refs
        } = vue.getCurrentInstance();
        if (!refs || !refs.input.$el) return;
        const innerInput = refs.input.$el && refs.input.$refs.input;
        innerInput.setAttribute('aria-valuenow', state.currentValue);
      });
      vue.watch(modelValue, value => {
        let newVal = value === undefined ? value : Number(value);

        if (newVal !== undefined) {
          if (isNaN(newVal)) {
            return;
          }

          if (stepStrictly.value) {
            const stepPrecision = getPrecision(step.value);
            const precisionFactor = Math.pow(10, stepPrecision);
            newVal = Math.round(newVal / step.value) * precisionFactor * step.value / precisionFactor;
          }

          if (precision.value !== undefined) {
            newVal = toPrecision(newVal, precision.value);
          }
        }

        if (newVal >= max.value) newVal = max.value;
        if (newVal <= min.value) newVal = min.value;
        state.currentValue = newVal;
        state.userInput = null;
        emit('update:modelValue', newVal);
      }, {
        immediate: true
      });

      const handleBlur = event => {
        emit('blur', event);
      };

      const handleFocus = event => {
        emit('focus', event);
      };

      const select = () => {};

      return {
        controlsAtRight,
        inputNumberSize,
        displayValue,
        minDisabled,
        maxDisabled,
        inputNumberDisabled,
        increase,
        decrease,
        handleInputChange,
        handleInput,
        focus,
        setCurrentValue,
        handleBlur,
        handleFocus,
        select
      };
    }

  };

  function render$1a(_ctx, _cache, $props, $setup, $data, $options) {
    const _component_el_input = vue.resolveComponent("el-input");

    const _directive_repeat_click = vue.resolveDirective("repeat-click");

    return vue.openBlock(), vue.createBlock("div", {
      class: ['el-input-number', $setup.inputNumberSize ? 'el-input-number--' + $setup.inputNumberSize : '', {
        'is-disabled': $setup.inputNumberDisabled
      }, {
        'is-without-controls': !$props.controls
      }, {
        'is-controls-right': $setup.controlsAtRight
      }],
      onDragstart: _cache[4] || (_cache[4] = vue.withModifiers(() => {}, ["prevent"]))
    }, [$props.controls ? vue.withDirectives((vue.openBlock(), vue.createBlock("span", {
      key: 0,
      class: [{
        'is-disabled': $setup.minDisabled
      }, "el-input-number__decrease"],
      onKeydown: _cache[1] || (_cache[1] = vue.withKeys((...args) => $setup.decrease && $setup.decrease(...args), ["enter"])),
      role: "button"
    }, [vue.createVNode("i", {
      class: `el-icon-${$setup.controlsAtRight ? 'arrow-down' : 'minus'}`
    }, null, 2
    /* CLASS */
    )], 34
    /* CLASS, HYDRATE_EVENTS */
    )), [[_directive_repeat_click, $setup.decrease]]) : vue.createCommentVNode("v-if", true), $props.controls ? vue.withDirectives((vue.openBlock(), vue.createBlock("span", {
      key: 1,
      class: [{
        'is-disabled': $setup.maxDisabled
      }, "el-input-number__increase"],
      onKeydown: _cache[2] || (_cache[2] = vue.withKeys((...args) => $setup.increase && $setup.increase(...args), ["enter"])),
      role: "button"
    }, [vue.createVNode("i", {
      class: `el-icon-${$setup.controlsAtRight ? 'arrow-up' : 'plus'}`
    }, null, 2
    /* CLASS */
    )], 34
    /* CLASS, HYDRATE_EVENTS */
    )), [[_directive_repeat_click, $setup.increase]]) : vue.createCommentVNode("v-if", true), vue.createVNode(_component_el_input, {
      disabled: $setup.inputNumberDisabled,
      label: $props.label,
      max: $props.max,
      min: $props.min,
      name: $props.name,
      placeholder: $props.placeholder,
      size: $setup.inputNumberSize,
      onBlur: $setup.handleBlur,
      onChange: $setup.handleInputChange,
      onFocus: $setup.handleFocus,
      onInput: $setup.handleInput,
      onKeydown: [vue.withKeys(vue.withModifiers($setup.decrease, ["prevent"]), ["down"]), vue.withKeys(vue.withModifiers($setup.increase, ["prevent"]), ["up"])],
      ref: "input",
      modelValue: $setup.displayValue,
      "onUpdate:modelValue": _cache[3] || (_cache[3] = $event => $setup.displayValue = $event)
    }, null, 8
    /* PROPS */
    , ["disabled", "label", "max", "min", "name", "placeholder", "size", "onBlur", "onChange", "onFocus", "onInput", "onKeydown", "modelValue"])], 34
    /* CLASS, HYDRATE_EVENTS */
    );
  }

  script$1k.render = render$1a;
  script$1k.__file = "packages/input-number/InputNumber.vue";

  /* istanbul ignore next */

  script$1k.install = function (app) {
    app.component(script$1k.name, script$1k);
  };

  function Focus (ref) {
    return {
      methods: {
        focus() {
          this.$refs[ref].focus();
        }

      }
    };
  }

  var defaultLang = {
    el: {
      colorpicker: {
        confirm: '确定',
        clear: '清空'
      },
      datepicker: {
        now: '此刻',
        today: '今天',
        cancel: '取消',
        clear: '清空',
        confirm: '确定',
        selectDate: '选择日期',
        selectTime: '选择时间',
        startDate: '开始日期',
        startTime: '开始时间',
        endDate: '结束日期',
        endTime: '结束时间',
        prevYear: '前一年',
        nextYear: '后一年',
        prevMonth: '上个月',
        nextMonth: '下个月',
        year: '年',
        month1: '1 月',
        month2: '2 月',
        month3: '3 月',
        month4: '4 月',
        month5: '5 月',
        month6: '6 月',
        month7: '7 月',
        month8: '8 月',
        month9: '9 月',
        month10: '10 月',
        month11: '11 月',
        month12: '12 月',
        // week: '周次',
        weeks: {
          sun: '日',
          mon: '一',
          tue: '二',
          wed: '三',
          thu: '四',
          fri: '五',
          sat: '六'
        },
        months: {
          jan: '一月',
          feb: '二月',
          mar: '三月',
          apr: '四月',
          may: '五月',
          jun: '六月',
          jul: '七月',
          aug: '八月',
          sep: '九月',
          oct: '十月',
          nov: '十一月',
          dec: '十二月'
        }
      },
      select: {
        loading: '加载中',
        noMatch: '无匹配数据',
        noData: '无数据',
        placeholder: '请选择'
      },
      cascader: {
        noMatch: '无匹配数据',
        loading: '加载中',
        placeholder: '请选择',
        noData: '暂无数据'
      },
      pagination: {
        goto: '前往',
        pagesize: '条/页',
        total: '共 {total} 条',
        pageClassifier: '页'
      },
      messagebox: {
        title: '提示',
        confirm: '确定',
        cancel: '取消',
        error: '输入的数据不合法!'
      },
      upload: {
        deleteTip: '按 delete 键可删除',
        delete: '删除',
        preview: '查看图片',
        continue: '继续上传'
      },
      table: {
        emptyText: '暂无数据',
        confirmFilter: '筛选',
        resetFilter: '重置',
        clearFilter: '全部',
        sumText: '合计'
      },
      tree: {
        emptyText: '暂无数据'
      },
      transfer: {
        noMatch: '无匹配数据',
        noData: '无数据',
        titles: ['列表 1', '列表 2'],
        filterPlaceholder: '请输入搜索内容',
        noCheckedFormat: '共 {total} 项',
        hasCheckedFormat: '已选 {checked}/{total} 项'
      },
      image: {
        error: '加载失败'
      },
      pageHeader: {
        title: '返回'
      },
      popconfirm: {
        confirmButtonText: '确定',
        cancelButtonText: '取消'
      }
    }
  };

  function isString(obj) {
    return Object.prototype.toString.call(obj) === '[object String]';
  }
  function isNumber(obj) {
    return Object.prototype.toString.call(obj) === '[object Number]';
  }
  function isObject$2(obj) {
    return Object.prototype.toString.call(obj) === '[object Object]';
  }
  function isArray(value) {
    return value instanceof Array;
  }
  function isHtmlElement(node) {
    return node && node.nodeType === Node.ELEMENT_NODE;
  }
  const isFunction$1 = functionToCheck => {
    var getType = {};
    return functionToCheck && getType.toString.call(functionToCheck) === '[object Function]';
  };
  const isUndefined = val => {
    // eslint-disable-next-line no-void
    return val === void 0;
  };
  const isDefined = val => {
    return val !== undefined && val !== null;
  };

  const hasOwnProperty$1 = Object.prototype.hasOwnProperty;
  function noop$1() {}
  function hasOwn$1(obj, key) {
    return hasOwnProperty$1.call(obj, key);
  }

  function extend(to, _from) {
    for (const key in _from) {
      to[key] = _from[key];
    }

    return to;
  }

  function toObject(arr) {
    var res = {};

    for (let i = 0; i < arr.length; i++) {
      if (arr[i]) {
        extend(res, arr[i]);
      }
    }

    return res;
  }
  const getValueByPath = function (object, prop) {
    prop = prop || '';
    const paths = prop.split('.');
    let current = object;
    let result = null;

    for (let i = 0, j = paths.length; i < j; i++) {
      const path = paths[i];
      if (!current) break;

      if (i === j - 1) {
        result = current[path];
        break;
      }

      current = current[path];
    }

    return result;
  };
  function getPropByPath(obj, path, strict) {
    let tempObj = obj;
    path = path.replace(/\[(\w+)\]/g, '.$1');
    path = path.replace(/^\./, '');
    const keyArr = path.split('.');
    let i = 0;

    for (let len = keyArr.length; i < len - 1; ++i) {
      if (!tempObj && !strict) break;
      const key = keyArr[i];

      if (key in tempObj) {
        tempObj = tempObj[key];
      } else {
        if (strict) {
          throw new Error('please transfer a valid prop path to form item!');
        }

        break;
      }
    }

    return {
      o: tempObj,
      k: keyArr[i],
      v: tempObj ? tempObj[keyArr[i]] : null
    };
  }
  const generateId = function () {
    return Math.floor(Math.random() * 10000);
  };
  const valueEquals = (a, b) => {
    // see: https://stackoverflow.com/questions/3115982/how-to-check-if-two-arrays-are-equal-with-javascript
    if (a === b) return true;
    if (!(a instanceof Array)) return false;
    if (!(b instanceof Array)) return false;
    if (a.length !== b.length) return false;

    for (let i = 0; i !== a.length; ++i) {
      if (a[i] !== b[i]) return false;
    }

    return true;
  };
  const escapeRegexpString = (value = '') => String(value).replace(/[|\\{}()[\]^$+*?.]/g, '\\$&'); // TODO: use native Array.find, Array.findIndex when IE support is dropped

  const arrayFindIndex = function (arr, pred) {
    for (let i = 0; i !== arr.length; ++i) {
      if (pred(arr[i])) {
        return i;
      }
    }

    return -1;
  };
  const arrayFind = function (arr, pred) {
    const idx = arrayFindIndex(arr, pred);
    return idx !== -1 ? arr[idx] : undefined;
  }; // coerce truthy value to array

  const coerceTruthyValueToArray = function (val) {
    if (Array.isArray(val)) {
      return val;
    } else if (val) {
      return [val];
    } else {
      return [];
    }
  };
  const isIE = function () {
    return !isNaN(Number(document.documentMode)); // return !Vue.prototype.$isServer && !isNaN(Number(document.documentMode))
  };
  const isEdge = function () {
    return navigator.userAgent.indexOf('Edge') > -1; // return !Vue.prototype.$isServer && navigator.userAgent.indexOf('Edge') > -1
  };
  const isFirefox = function () {
    return !!window.navigator.userAgent.match(/firefox/i); // return !Vue.prototype.$isServer && !!window.navigator.userAgent.match(/firefox/i)
  };
  const autoprefixer = function (style) {
    if (typeof style !== 'object') return style;
    const rules = ['transform', 'transition', 'animation'];
    const prefixes = ['ms-', 'webkit-'];
    rules.forEach(rule => {
      const value = style[rule];

      if (rule && value) {
        prefixes.forEach(prefix => {
          style[prefix + rule] = value;
        });
      }
    });
    return style;
  };
  const kebabCase = function (str) {
    const hyphenateRE = /([^-])([A-Z])/g;
    return str.replace(hyphenateRE, '$1-$2').replace(hyphenateRE, '$1-$2').toLowerCase();
  };
  const capitalize = function (str) {
    if (!isString(str)) return str;
    return str.charAt(0).toUpperCase() + str.slice(1);
  };
  const looseEqual = function (a, b) {
    const isObjectA = isObject$2(a);
    const isObjectB = isObject$2(b);

    if (isObjectA && isObjectB) {
      return JSON.stringify(a) === JSON.stringify(b);
    } else if (!isObjectA && !isObjectB) {
      return String(a) === String(b);
    } else {
      return false;
    }
  };
  const arrayEquals = function (arrayA, arrayB) {
    arrayA = arrayA || [];
    arrayB = arrayB || [];

    if (arrayA.length !== arrayB.length) {
      return false;
    }

    for (let i = 0; i < arrayA.length; i++) {
      if (!looseEqual(arrayA[i], arrayB[i])) {
        return false;
      }
    }

    return true;
  };
  const isEqual = function (value1, value2) {
    if (Array.isArray(value1) && Array.isArray(value2)) {
      return arrayEquals(value1, value2);
    }

    return looseEqual(value1, value2);
  };
  const isEmpty = function (val) {
    // null or undefined
    if (val == null) return true;
    if (typeof val === 'boolean') return false;
    if (typeof val === 'number') return !val;
    if (val instanceof Error) return val.message === '';

    switch (Object.prototype.toString.call(val)) {
      // String or Array
      case '[object String]':
      case '[object Array]':
        return !val.length;
      // Map or Set or File

      case '[object File]':
      case '[object Map]':
      case '[object Set]':
        {
          return !val.size;
        }
      // Plain Object

      case '[object Object]':
        {
          return !Object.keys(val).length;
        }
    }

    return false;
  };
  function rafThrottle(fn) {
    let locked = false;
    return function (...args) {
      if (locked) return;
      locked = true;
      window.requestAnimationFrame(() => {
        fn.apply(this, args);
        locked = false;
      });
    };
  }

  const RE_NARGS = /(%|)\{([0-9a-zA-Z_]+)\}/g;
  /**
   *  String format template
   *  - Inspired:
   *    https://github.com/Matt-Esch/string-template/index.js
   */

  function Format () {
    /**
     * template
     *
     * @param {String} string
     * @param {Array} ...args
     * @return {String}
     */
    function template(string, ...args) {
      if (args.length === 1 && typeof args[0] === 'object') {
        args = args[0];
      }

      if (!args || !args.hasOwnProperty) {
        args = {};
      }

      return string.replace(RE_NARGS, (match, prefix, i, index) => {
        let result;

        if (string[index - 1] === '{' && string[index + match.length] === '}') {
          return i;
        } else {
          result = hasOwn$1(args, i) ? args[i] : null;

          if (result === null || result === undefined) {
            return '';
          }

          return result;
        }
      });
    }

    return template;
  }

  const format$1 = Format();
  let lang = defaultLang; // let merged = false

  let i18nHandler = function () {// #todo
    // const vuei18n = Object.getPrototypeOf(this || Vue).$t
    // if (typeof vuei18n === 'function' && !!Vue.locale) {
    //   if (!merged) {
    //     merged = true
    //     Vue.locale(
    //       Vue.config.lang,
    //       deepmerge(lang, Vue.locale(Vue.config.lang) || {}, { clone: true })
    //     )
    //   }
    //   return vuei18n.apply(this, arguments)
    // }
  };

  const t = function (path, options) {
    let value = i18nHandler.apply(this, arguments);
    if (value !== null && value !== undefined) return value;
    const array = path.split('.');
    let current = lang;

    for (let i = 0, j = array.length; i < j; i++) {
      const property = array[i];
      value = current[property];
      if (i === j - 1) return format$1(value, options);
      if (!value) return '';
      current = value;
    }

    return '';
  };

  var Locale = {
    methods: {
      t(...args) {
        return t.apply(this, args);
      }

    }
  };

  function merge (target) {
    for (let i = 1, j = arguments.length; i < j; i++) {
      const source = arguments[i] || {};

      for (const prop in source) {
        if (Object.hasOwnProperty.call(source, prop)) {
          const value = source[prop];

          if (value !== undefined) {
            target[prop] = value;
          }
        }
      }
    }

    return target;
  }

  let hasModal = false;
  let hasInitZIndex = false;
  let zIndex;

  const getModal = function () {
    // if (Vue.prototype.$isServer) return
    let modalDom = PopupManager.modalDom;

    if (modalDom) {
      hasModal = true;
    } else {
      hasModal = false;
      modalDom = document.createElement('div');
      PopupManager.modalDom = modalDom;
      modalDom.addEventListener('touchmove', function (event) {
        event.preventDefault();
        event.stopPropagation();
      }, {
        passive: true
      });
      modalDom.addEventListener('click', function () {
        PopupManager.doOnModalClick && PopupManager.doOnModalClick();
      });
    }

    return modalDom;
  };

  const instances = {};
  const PopupManager = {
    modalFade: true,
    getInstance: function (id) {
      return instances[id];
    },
    register: function (id, instance) {
      if (id && instance) {
        instances[id] = instance;
      }
    },
    deregister: function (id) {
      if (id) {
        instances[id] = null;
        delete instances[id];
      }
    },
    nextZIndex: function () {
      return PopupManager.zIndex++;
    },
    modalStack: [],
    doOnModalClick: function () {
      const topItem = PopupManager.modalStack[PopupManager.modalStack.length - 1];
      if (!topItem) return;
      const instance = PopupManager.getInstance(topItem.id);

      if (instance && instance.closeOnClickModal) {
        instance.close();
      }
    },
    openModal: function (id, zIndex, dom, modalClass, modalFade) {
      // if (Vue.prototype.$isServer) return
      if (!id || zIndex === undefined) return;
      this.modalFade = modalFade;
      const modalStack = this.modalStack;

      for (let i = 0, j = modalStack.length; i < j; i++) {
        const item = modalStack[i];

        if (item.id === id) {
          return;
        }
      }

      const modalDom = getModal();

      if (zIndex) {
        modalDom.style.zIndex = zIndex;
      }

      addClass(modalDom, 'v-modal');

      if (this.modalFade && !hasModal) {
        addClass(modalDom, 'v-modal-enter');
      }

      if (modalClass) {
        const classArr = modalClass.trim().split(/\s+/);
        classArr.forEach(item => addClass(modalDom, item));
      }

      setTimeout(() => {
        removeClass(modalDom, 'v-modal-enter');
      }, 200);

      if (dom && dom.parentNode && dom.parentNode.nodeType !== 11) {
        dom.parentNode.appendChild(modalDom);
      } else {
        document.body.appendChild(modalDom);
      }

      modalDom.tabIndex = 0;
      modalDom.style.display = '';
      this.modalStack.push({
        id: id,
        zIndex: zIndex,
        modalClass: modalClass
      });
    },
    closeModal: function (id) {
      const modalStack = this.modalStack;
      const modalDom = getModal();

      if (modalStack.length > 0) {
        const topItem = modalStack[modalStack.length - 1];

        if (topItem.id === id) {
          if (topItem.modalClass) {
            const classArr = topItem.modalClass.trim().split(/\s+/);
            classArr.forEach(item => removeClass(modalDom, item));
          }

          modalStack.pop();

          if (modalStack.length > 0) {
            modalDom.style.zIndex = modalStack[modalStack.length - 1].zIndex;
          }
        } else {
          for (let i = modalStack.length - 1; i >= 0; i--) {
            if (modalStack[i].id === id) {
              modalStack.splice(i, 1);
              break;
            }
          }
        }
      }

      if (modalStack.length === 0) {
        if (this.modalFade) {
          addClass(modalDom, 'v-modal-leave');
        }

        setTimeout(() => {
          if (modalStack.length === 0) {
            if (modalDom.parentNode) modalDom.parentNode.removeChild(modalDom);
            modalDom.style.display = 'none';
            PopupManager.modalDom = undefined;
          }

          removeClass(modalDom, 'v-modal-leave');
        }, 200);
      }
    }
  };
  Object.defineProperty(PopupManager, 'zIndex', {
    configurable: true,

    get() {
      if (!hasInitZIndex) {
        // zIndex = zIndex || (Vue.prototype.$ELEMENT || {}).zIndex || 2000
        zIndex = zIndex || 2000;
        hasInitZIndex = true;
      }

      return zIndex;
    },

    set(value) {
      zIndex = value;
    }

  });

  const getTopPopup = function () {
    // if (Vue.prototype.$isServer) return
    if (PopupManager.modalStack.length > 0) {
      const topPopup = PopupManager.modalStack[PopupManager.modalStack.length - 1];
      if (!topPopup) return;
      const instance = PopupManager.getInstance(topPopup.id);
      return instance;
    }
  }; // if (!Vue.prototype.$isServer) {
  // handle `esc` key when the popup is shown


  window.addEventListener('keydown', function (event) {
    if (event.keyCode === 27) {
      const topPopup = getTopPopup();

      if (topPopup && topPopup.closeOnPressEscape) {
        topPopup.handleClose ? topPopup.handleClose() : topPopup.handleAction ? topPopup.handleAction('cancel') : topPopup.close();
      }
    }
  });

  let scrollBarWidth$1;
  function getScrollBarWidth () {
    // if (Vue.prototype.$isServer) return 0
    if (scrollBarWidth$1 !== undefined) return scrollBarWidth$1;
    const outer = document.createElement('div');
    outer.className = 'el-scrollbar__wrap';
    outer.style.visibility = 'hidden';
    outer.style.width = '100px';
    outer.style.position = 'absolute';
    outer.style.top = '-9999px';
    document.body.appendChild(outer);
    const widthNoScroll = outer.offsetWidth;
    outer.style.overflow = 'scroll';
    const inner = document.createElement('div');
    inner.style.width = '100%';
    outer.appendChild(inner);
    const widthWithScroll = inner.offsetWidth;
    outer.parentNode.removeChild(outer);
    scrollBarWidth$1 = widthNoScroll - widthWithScroll;
    return scrollBarWidth$1;
  }

  /* eslint-disable no-unused-vars */

  var root$1 = window; // default options

  var DEFAULTS = {
    // placement of the popper
    placement: 'bottom',
    gpuAcceleration: true,
    // shift popper from its origin by the given amount of pixels (can be negative)
    offset: 0,
    // the element which will act as boundary of the popper
    boundariesElement: 'viewport',
    // amount of pixel used to define a minimum distance between the boundaries and the popper
    boundariesPadding: 5,
    // popper will try to prevent overflow following this order,
    // by default, then, it could overflow on the left and on top of the boundariesElement
    preventOverflowOrder: ['left', 'right', 'top', 'bottom'],
    // the behavior used by flip to change the placement of the popper
    flipBehavior: 'flip',
    arrowElement: '[x-arrow]',
    arrowOffset: 0,
    // list of functions used to modify the offsets before they are applied to the popper
    modifiers: ['shift', 'offset', 'preventOverflow', 'keepTogether', 'arrow', 'flip', 'applyStyle'],
    modifiersIgnored: [],
    forceAbsolute: false
  };
  /**
   * Create a new Popper.js instance
   * @constructor Popper
   * @param {HTMLElement} reference - The reference element used to position the popper
   * @param {HTMLElement|Object} popper
   *      The HTML element used as popper, or a configuration used to generate the popper.
   * @param {String} [popper.tagName='div'] The tag name of the generated popper.
   * @param {Array} [popper.classNames=['popper']] Array of classes to apply to the generated popper.
   * @param {Array} [popper.attributes] Array of attributes to apply, specify `attr:value` to assign a value to it.
   * @param {HTMLElement|String} [popper.parent=window.document.body] The parent element, given as HTMLElement or as query string.
   * @param {String} [popper.content=''] The content of the popper, it can be text, html, or node; if it is not text, set `contentType` to `html` or `node`.
   * @param {String} [popper.contentType='text'] If `html`, the `content` will be parsed as HTML. If `node`, it will be appended as-is.
   * @param {String} [popper.arrowTagName='div'] Same as `popper.tagName` but for the arrow element.
   * @param {Array} [popper.arrowClassNames='popper__arrow'] Same as `popper.classNames` but for the arrow element.
   * @param {String} [popper.arrowAttributes=['x-arrow']] Same as `popper.attributes` but for the arrow element.
   * @param {Object} options
   * @param {String} [options.placement=bottom]
   *      Placement of the popper accepted values: `top(-start, -end), right(-start, -end), bottom(-start, -right),
   *      left(-start, -end)`
   *
   * @param {HTMLElement|String} [options.arrowElement='[x-arrow]']
   *      The DOM Node used as arrow for the popper, or a CSS selector used to get the DOM node. It must be child of
   *      its parent Popper. Popper.js will apply to the given element the style required to align the arrow with its
   *      reference element.
   *      By default, it will look for a child node of the popper with the `x-arrow` attribute.
   *
   * @param {Boolean} [options.gpuAcceleration=true]
   *      When this property is set to true, the popper position will be applied using CSS3 translate3d, allowing the
   *      browser to use the GPU to accelerate the rendering.
   *      If set to false, the popper will be placed using `top` and `left` properties, not using the GPU.
   *
   * @param {Number} [options.offset=0]
   *      Amount of pixels the popper will be shifted (can be negative).
   *
   * @param {String|Element} [options.boundariesElement='viewport']
   *      The element which will define the boundaries of the popper position, the popper will never be placed outside
   *      of the defined boundaries (except if `keepTogether` is enabled)
   *
   * @param {Number} [options.boundariesPadding=5]
   *      Additional padding for the boundaries
   *
   * @param {Array} [options.preventOverflowOrder=['left', 'right', 'top', 'bottom']]
   *      Order used when Popper.js tries to avoid overflows from the boundaries, they will be checked in order,
   *      this means that the last ones will never overflow
   *
   * @param {String|Array} [options.flipBehavior='flip']
   *      The behavior used by the `flip` modifier to change the placement of the popper when the latter is trying to
   *      overlap its reference element. Defining `flip` as value, the placement will be flipped on
   *      its axis (`right - left`, `top - bottom`).
   *      You can even pass an array of placements (eg: `['right', 'left', 'top']` ) to manually specify
   *      how alter the placement when a flip is needed. (eg. in the above example, it would first flip from right to left,
   *      then, if even in its new placement, the popper is overlapping its reference element, it will be moved to top)
   *
   * @param {Array} [options.modifiers=[ 'shift', 'offset', 'preventOverflow', 'keepTogether', 'arrow', 'flip', 'applyStyle']]
   *      List of functions used to modify the data before they are applied to the popper, add your custom functions
   *      to this array to edit the offsets and placement.
   *      The function should reflect the @params and @returns of preventOverflow
   *
   * @param {Array} [options.modifiersIgnored=[]]
   *      Put here any built-in modifier name you want to exclude from the modifiers list
   *      The function should reflect the @params and @returns of preventOverflow
   *
   * @param {Boolean} [options.removeOnDestroy=false]
   *      Set to true if you want to automatically remove the popper when you call the `destroy` method.
   */

  function Popper$1(reference, popper, options) {
    this._reference = reference.jquery ? reference[0] : reference;
    this.state = {}; // if the popper variable is a configuration object, parse it to generate an HTMLElement
    // generate a default popper if is not defined

    var isNotDefined = typeof popper === 'undefined' || popper === null;
    var isConfig = popper && Object.prototype.toString.call(popper) === '[object Object]';

    if (isNotDefined || isConfig) {
      this._popper = this.parse(isConfig ? popper : {});
    } // otherwise, use the given HTMLElement as popper
    else {
        this._popper = popper.jquery ? popper[0] : popper;
      } // with {} we create a new object with the options inside it


    this._options = Object.assign({}, DEFAULTS, options); // refactoring modifiers' list

    this._options.modifiers = this._options.modifiers.map(function (modifier) {
      // remove ignored modifiers
      if (this._options.modifiersIgnored.indexOf(modifier) !== -1) return; // set the x-placement attribute before everything else because it could be used to add margins to the popper
      // margins needs to be calculated to get the correct popper offsets

      if (modifier === 'applyStyle') {
        this._popper.setAttribute('x-placement', this._options.placement);
      } // return predefined modifier identified by string or keep the custom one


      return this.modifiers[modifier] || modifier;
    }.bind(this)); // make sure to apply the popper position before any computation

    this.state.position = this._getPosition(this._popper, this._reference);
    setStyle(this._popper, {
      position: this.state.position,
      top: 0
    }); // fire the first update to position the popper in the right place

    this.update(); // setup event listeners, they will take care of update the position in specific situations

    this._setupEventListeners();

    return this;
  } //
  // Methods
  //

  /**
   * Destroy the popper
   * @method
   * @memberof Popper
   */

  Popper$1.prototype.destroy = function () {
    this._popper.removeAttribute('x-placement');

    this._popper.style.left = '';
    this._popper.style.position = '';
    this._popper.style.top = '';
    this._popper.style[getSupportedPropertyName('transform')] = '';

    this._removeEventListeners(); // remove the popper if user explicity asked for the deletion on destroy


    if (this._options.removeOnDestroy) {
      this._popper.remove();
    }

    return this;
  };
  /**
   * Updates the position of the popper, computing the new offsets and applying the new style
   * @method
   * @memberof Popper
   */


  Popper$1.prototype.update = function () {
    var data = {
      instance: this,
      styles: {}
    }; // store placement inside the data object, modifiers will be able to edit `placement` if needed
    // and refer to _originalPlacement to know the original value

    data.placement = this._options.placement;
    data._originalPlacement = this._options.placement; // compute the popper and reference offsets and put them inside data.offsets

    data.offsets = this._getOffsets(this._popper, this._reference, data.placement); // get boundaries

    data.boundaries = this._getBoundaries(data, this._options.boundariesPadding, this._options.boundariesElement);
    data = this.runModifiers(data, this._options.modifiers);

    if (typeof this.state.updateCallback === 'function') {
      this.state.updateCallback(data);
    }
  };
  /**
   * If a function is passed, it will be executed after the initialization of popper with as first argument the Popper instance.
   * @method
   * @memberof Popper
   * @param {Function} callback
   */


  Popper$1.prototype.onCreate = function (callback) {
    // the createCallbacks return as first argument the popper instance
    callback(this);
    return this;
  };
  /**
   * If a function is passed, it will be executed after each update of popper with as first argument the set of coordinates and informations
   * used to style popper and its arrow.
   * NOTE: it doesn't get fired on the first call of the `Popper.update()` method inside the `Popper` constructor!
   * @method
   * @memberof Popper
   * @param {Function} callback
   */


  Popper$1.prototype.onUpdate = function (callback) {
    this.state.updateCallback = callback;
    return this;
  };
  /**
   * Helper used to generate poppers from a configuration file
   * @method
   * @memberof Popper
   * @param config {Object} configuration
   * @returns {HTMLElement} popper
   */


  Popper$1.prototype.parse = function (config) {
    var defaultConfig = {
      tagName: 'div',
      classNames: ['popper'],
      attributes: [],
      parent: root$1.document.body,
      content: '',
      contentType: 'text',
      arrowTagName: 'div',
      arrowClassNames: ['popper__arrow'],
      arrowAttributes: ['x-arrow']
    };
    config = Object.assign({}, defaultConfig, config);
    var d = root$1.document;
    var popper = d.createElement(config.tagName);
    addClassNames(popper, config.classNames);
    addAttributes(popper, config.attributes);

    if (config.contentType === 'node') {
      popper.appendChild(config.content.jquery ? config.content[0] : config.content);
    } else if (config.contentType === 'html') {
      popper.innerHTML = config.content;
    } else {
      popper.textContent = config.content;
    }

    if (config.arrowTagName) {
      var arrow = d.createElement(config.arrowTagName);
      addClassNames(arrow, config.arrowClassNames);
      addAttributes(arrow, config.arrowAttributes);
      popper.appendChild(arrow);
    }

    var parent = config.parent.jquery ? config.parent[0] : config.parent; // if the given parent is a string, use it to match an element
    // if more than one element is matched, the first one will be used as parent
    // if no elements are matched, the script will throw an error

    if (typeof parent === 'string') {
      parent = d.querySelectorAll(config.parent);

      if (parent.length > 1) {
        console.warn('WARNING: the given `parent` query(' + config.parent + ') matched more than one element, the first one will be used');
      }

      if (parent.length === 0) {
        throw "ERROR: the given `parent` doesn't exists!";
      }

      parent = parent[0];
    } // if the given parent is a DOM nodes list or an array of nodes with more than one element,
    // the first one will be used as parent


    if (parent.length > 1 && parent instanceof Element === false) {
      console.warn('WARNING: you have passed as parent a list of elements, the first one will be used');
      parent = parent[0];
    } // append the generated popper to its parent


    parent.appendChild(popper);
    return popper;
    /**
     * Adds class names to the given element
     * @function
     * @ignore
     * @param {HTMLElement} target
     * @param {Array} classes
     */

    function addClassNames(element, classNames) {
      classNames.forEach(function (className) {
        element.classList.add(className);
      });
    }
    /**
     * Adds attributes to the given element
     * @function
     * @ignore
     * @param {HTMLElement} target
     * @param {Array} attributes
     * @example
     * addAttributes(element, [ 'data-info:foobar' ]);
     */


    function addAttributes(element, attributes) {
      attributes.forEach(function (attribute) {
        element.setAttribute(attribute.split(':')[0], attribute.split(':')[1] || '');
      });
    }
  };
  /**
   * Helper used to get the position which will be applied to the popper
   * @method
   * @memberof Popper
   * @param config {HTMLElement} popper element
   * @param reference {HTMLElement} reference element
   * @returns {String} position
   */


  Popper$1.prototype._getPosition = function (popper, reference) {
    getOffsetParent(reference);

    if (this._options.forceAbsolute) {
      return 'absolute';
    } // Decide if the popper will be fixed
    // If the reference element is inside a fixed context, the popper will be fixed as well to allow them to scroll together


    var isParentFixed = isFixed(reference);
    return isParentFixed ? 'fixed' : 'absolute';
  };
  /**
   * Get offsets to the popper
   * @method
   * @memberof Popper
   * @access private
   * @param {Element} popper - the popper element
   * @param {Element} reference - the reference element (the popper will be relative to this)
   * @returns {Object} An object containing the offsets which will be applied to the popper
   */


  Popper$1.prototype._getOffsets = function (popper, reference, placement) {
    placement = placement.split('-')[0];
    var popperOffsets = {};
    popperOffsets.position = this.state.position;
    var isParentFixed = popperOffsets.position === 'fixed'; //
    // Get reference element position
    //

    var referenceOffsets = getOffsetRectRelativeToCustomParent(reference, getOffsetParent(popper), isParentFixed); //
    // Get popper sizes
    //

    var popperRect = getOuterSizes(popper); //
    // Compute offsets of popper
    //
    // depending by the popper placement we have to compute its offsets slightly differently

    if (['right', 'left'].indexOf(placement) !== -1) {
      popperOffsets.top = referenceOffsets.top + referenceOffsets.height / 2 - popperRect.height / 2;

      if (placement === 'left') {
        popperOffsets.left = referenceOffsets.left - popperRect.width;
      } else {
        popperOffsets.left = referenceOffsets.right;
      }
    } else {
      popperOffsets.left = referenceOffsets.left + referenceOffsets.width / 2 - popperRect.width / 2;

      if (placement === 'top') {
        popperOffsets.top = referenceOffsets.top - popperRect.height;
      } else {
        popperOffsets.top = referenceOffsets.bottom;
      }
    } // Add width and height to our offsets object


    popperOffsets.width = popperRect.width;
    popperOffsets.height = popperRect.height;
    return {
      popper: popperOffsets,
      reference: referenceOffsets
    };
  };
  /**
   * Setup needed event listeners used to update the popper position
   * @method
   * @memberof Popper
   * @access private
   */


  Popper$1.prototype._setupEventListeners = function () {
    // NOTE: 1 DOM access here
    this.state.updateBound = this.update.bind(this);
    root$1.addEventListener('resize', this.state.updateBound); // if the boundariesElement is window we don't need to listen for the scroll event

    if (this._options.boundariesElement !== 'window') {
      var target = getScrollParent(this._reference); // here it could be both `body` or `documentElement` thanks to Firefox, we then check both

      if (target === root$1.document.body || target === root$1.document.documentElement) {
        target = root$1;
      }

      target.addEventListener('scroll', this.state.updateBound);
      this.state.scrollTarget = target;
    }
  };
  /**
   * Remove event listeners used to update the popper position
   * @method
   * @memberof Popper
   * @access private
   */


  Popper$1.prototype._removeEventListeners = function () {
    // NOTE: 1 DOM access here
    root$1.removeEventListener('resize', this.state.updateBound);

    if (this._options.boundariesElement !== 'window' && this.state.scrollTarget) {
      this.state.scrollTarget.removeEventListener('scroll', this.state.updateBound);
      this.state.scrollTarget = null;
    }

    this.state.updateBound = null;
  };
  /**
   * Computed the boundaries limits and return them
   * @method
   * @memberof Popper
   * @access private
   * @param {Object} data - Object containing the property "offsets" generated by `_getOffsets`
   * @param {Number} padding - Boundaries padding
   * @param {Element} boundariesElement - Element used to define the boundaries
   * @returns {Object} Coordinates of the boundaries
   */


  Popper$1.prototype._getBoundaries = function (data, padding, boundariesElement) {
    // NOTE: 1 DOM access here
    var boundaries = {};
    var width, height;

    if (boundariesElement === 'window') {
      var body = root$1.document.body,
          html = root$1.document.documentElement;
      height = Math.max(body.scrollHeight, body.offsetHeight, html.clientHeight, html.scrollHeight, html.offsetHeight);
      width = Math.max(body.scrollWidth, body.offsetWidth, html.clientWidth, html.scrollWidth, html.offsetWidth);
      boundaries = {
        top: 0,
        right: width,
        bottom: height,
        left: 0
      };
    } else if (boundariesElement === 'viewport') {
      var offsetParent = getOffsetParent(this._popper);
      var scrollParent = getScrollParent(this._popper);
      var offsetParentRect = getOffsetRect(offsetParent); // Thanks the fucking native API, `document.body.scrollTop` & `document.documentElement.scrollTop`

      var getScrollTopValue = function (element) {
        return element == document.body ? Math.max(document.documentElement.scrollTop, document.body.scrollTop) : element.scrollTop;
      };

      var getScrollLeftValue = function (element) {
        return element == document.body ? Math.max(document.documentElement.scrollLeft, document.body.scrollLeft) : element.scrollLeft;
      }; // if the popper is fixed we don't have to substract scrolling from the boundaries


      var scrollTop = data.offsets.popper.position === 'fixed' ? 0 : getScrollTopValue(scrollParent);
      var scrollLeft = data.offsets.popper.position === 'fixed' ? 0 : getScrollLeftValue(scrollParent);
      boundaries = {
        top: 0 - (offsetParentRect.top - scrollTop),
        right: root$1.document.documentElement.clientWidth - (offsetParentRect.left - scrollLeft),
        bottom: root$1.document.documentElement.clientHeight - (offsetParentRect.top - scrollTop),
        left: 0 - (offsetParentRect.left - scrollLeft)
      };
    } else {
      if (getOffsetParent(this._popper) === boundariesElement) {
        boundaries = {
          top: 0,
          left: 0,
          right: boundariesElement.clientWidth,
          bottom: boundariesElement.clientHeight
        };
      } else {
        boundaries = getOffsetRect(boundariesElement);
      }
    }

    boundaries.left += padding;
    boundaries.right -= padding;
    boundaries.top = boundaries.top + padding;
    boundaries.bottom = boundaries.bottom - padding;
    return boundaries;
  };
  /**
   * Loop trough the list of modifiers and run them in order, each of them will then edit the data object
   * @method
   * @memberof Popper
   * @access public
   * @param {Object} data
   * @param {Array} modifiers
   * @param {Function} ends
   */


  Popper$1.prototype.runModifiers = function (data, modifiers, ends) {
    var modifiersToRun = modifiers.slice();

    if (ends !== undefined) {
      modifiersToRun = this._options.modifiers.slice(0, getArrayKeyIndex(this._options.modifiers, ends));
    }

    modifiersToRun.forEach(function (modifier) {
      if (isFunction(modifier)) {
        data = modifier.call(this, data);
      }
    }.bind(this));
    return data;
  };
  /**
   * Helper used to know if the given modifier depends from another one.
   * @method
   * @memberof Popper
   * @param {String} requesting - name of requesting modifier
   * @param {String} requested - name of requested modifier
   * @returns {Boolean}
   */


  Popper$1.prototype.isModifierRequired = function (requesting, requested) {
    var index = getArrayKeyIndex(this._options.modifiers, requesting);
    return !!this._options.modifiers.slice(0, index).filter(function (modifier) {
      return modifier === requested;
    }).length;
  }; //
  // Modifiers
  //

  /**
   * Modifiers list
   * @namespace Popper.modifiers
   * @memberof Popper
   * @type {Object}
   */


  Popper$1.prototype.modifiers = {};
  /**
   * Apply the computed styles to the popper element
   * @method
   * @memberof Popper.modifiers
   * @argument {Object} data - The data object generated by `update` method
   * @returns {Object} The same data object
   */

  Popper$1.prototype.modifiers.applyStyle = function (data) {
    // apply the final offsets to the popper
    // NOTE: 1 DOM access here
    var styles = {
      position: data.offsets.popper.position
    }; // round top and left to avoid blurry text

    var left = Math.round(data.offsets.popper.left);
    var top = Math.round(data.offsets.popper.top); // if gpuAcceleration is set to true and transform is supported, we use `translate3d` to apply the position to the popper
    // we automatically use the supported prefixed version if needed

    var prefixedProperty;

    if (this._options.gpuAcceleration && (prefixedProperty = getSupportedPropertyName('transform'))) {
      styles[prefixedProperty] = 'translate3d(' + left + 'px, ' + top + 'px, 0)';
      styles.top = 0;
      styles.left = 0;
    } // othwerise, we use the standard `left` and `top` properties
    else {
        styles.left = left;
        styles.top = top;
      } // any property present in `data.styles` will be applied to the popper,
    // in this way we can make the 3rd party modifiers add custom styles to it
    // Be aware, modifiers could override the properties defined in the previous
    // lines of this modifier!


    Object.assign(styles, data.styles);
    setStyle(this._popper, styles); // set an attribute which will be useful to style the tooltip (use it to properly position its arrow)
    // NOTE: 1 DOM access here

    this._popper.setAttribute('x-placement', data.placement); // if the arrow modifier is required and the arrow style has been computed, apply the arrow style


    if (this.isModifierRequired(this.modifiers.applyStyle, this.modifiers.arrow) && data.offsets.arrow) {
      setStyle(data.arrowElement, data.offsets.arrow);
    }

    return data;
  };
  /**
   * Modifier used to shift the popper on the start or end of its reference element side
   * @method
   * @memberof Popper.modifiers
   * @argument {Object} data - The data object generated by `update` method
   * @returns {Object} The data object, properly modified
   */


  Popper$1.prototype.modifiers.shift = function (data) {
    var placement = data.placement;
    var basePlacement = placement.split('-')[0];
    var shiftVariation = placement.split('-')[1]; // if shift shiftVariation is specified, run the modifier

    if (shiftVariation) {
      var reference = data.offsets.reference;
      var popper = getPopperClientRect(data.offsets.popper);
      var shiftOffsets = {
        y: {
          start: {
            top: reference.top
          },
          end: {
            top: reference.top + reference.height - popper.height
          }
        },
        x: {
          start: {
            left: reference.left
          },
          end: {
            left: reference.left + reference.width - popper.width
          }
        }
      };
      var axis = ['bottom', 'top'].indexOf(basePlacement) !== -1 ? 'x' : 'y';
      data.offsets.popper = Object.assign(popper, shiftOffsets[axis][shiftVariation]);
    }

    return data;
  };
  /**
   * Modifier used to make sure the popper does not overflows from it's boundaries
   * @method
   * @memberof Popper.modifiers
   * @argument {Object} data - The data object generated by `update` method
   * @returns {Object} The data object, properly modified
   */


  Popper$1.prototype.modifiers.preventOverflow = function (data) {
    var order = this._options.preventOverflowOrder;
    var popper = getPopperClientRect(data.offsets.popper);
    var check = {
      left: function () {
        var left = popper.left;

        if (popper.left < data.boundaries.left) {
          left = Math.max(popper.left, data.boundaries.left);
        }

        return {
          left: left
        };
      },
      right: function () {
        var left = popper.left;

        if (popper.right > data.boundaries.right) {
          left = Math.min(popper.left, data.boundaries.right - popper.width);
        }

        return {
          left: left
        };
      },
      top: function () {
        var top = popper.top;

        if (popper.top < data.boundaries.top) {
          top = Math.max(popper.top, data.boundaries.top);
        }

        return {
          top: top
        };
      },
      bottom: function () {
        var top = popper.top;

        if (popper.bottom > data.boundaries.bottom) {
          top = Math.min(popper.top, data.boundaries.bottom - popper.height);
        }

        return {
          top: top
        };
      }
    };
    order.forEach(function (direction) {
      data.offsets.popper = Object.assign(popper, check[direction]());
    });
    return data;
  };
  /**
   * Modifier used to make sure the popper is always near its reference
   * @method
   * @memberof Popper.modifiers
   * @argument {Object} data - The data object generated by _update method
   * @returns {Object} The data object, properly modified
   */


  Popper$1.prototype.modifiers.keepTogether = function (data) {
    var popper = getPopperClientRect(data.offsets.popper);
    var reference = data.offsets.reference;
    var f = Math.floor;

    if (popper.right < f(reference.left)) {
      data.offsets.popper.left = f(reference.left) - popper.width;
    }

    if (popper.left > f(reference.right)) {
      data.offsets.popper.left = f(reference.right);
    }

    if (popper.bottom < f(reference.top)) {
      data.offsets.popper.top = f(reference.top) - popper.height;
    }

    if (popper.top > f(reference.bottom)) {
      data.offsets.popper.top = f(reference.bottom);
    }

    return data;
  };
  /**
   * Modifier used to flip the placement of the popper when the latter is starting overlapping its reference element.
   * Requires the `preventOverflow` modifier before it in order to work.
   * **NOTE:** This modifier will run all its previous modifiers everytime it tries to flip the popper!
   * @method
   * @memberof Popper.modifiers
   * @argument {Object} data - The data object generated by _update method
   * @returns {Object} The data object, properly modified
   */


  Popper$1.prototype.modifiers.flip = function (data) {
    // check if preventOverflow is in the list of modifiers before the flip modifier.
    // otherwise flip would not work as expected.
    if (!this.isModifierRequired(this.modifiers.flip, this.modifiers.preventOverflow)) {
      console.warn('WARNING: preventOverflow modifier is required by flip modifier in order to work, be sure to include it before flip!');
      return data;
    }

    if (data.flipped && data.placement === data._originalPlacement) {
      // seems like flip is trying to loop, probably there's not enough space on any of the flippable sides
      return data;
    }

    var placement = data.placement.split('-')[0];
    var placementOpposite = getOppositePlacement(placement);
    var variation = data.placement.split('-')[1] || '';
    var flipOrder = [];

    if (this._options.flipBehavior === 'flip') {
      flipOrder = [placement, placementOpposite];
    } else {
      flipOrder = this._options.flipBehavior;
    }

    flipOrder.forEach(function (step, index) {
      if (placement !== step || flipOrder.length === index + 1) {
        return;
      }

      placement = data.placement.split('-')[0];
      placementOpposite = getOppositePlacement(placement);
      var popperOffsets = getPopperClientRect(data.offsets.popper); // this boolean is used to distinguish right and bottom from top and left
      // they need different computations to get flipped

      var a = ['right', 'bottom'].indexOf(placement) !== -1; // using Math.floor because the reference offsets may contain decimals we are not going to consider here

      if (a && Math.floor(data.offsets.reference[placement]) > Math.floor(popperOffsets[placementOpposite]) || !a && Math.floor(data.offsets.reference[placement]) < Math.floor(popperOffsets[placementOpposite])) {
        // we'll use this boolean to detect any flip loop
        data.flipped = true;
        data.placement = flipOrder[index + 1];

        if (variation) {
          data.placement += '-' + variation;
        }

        data.offsets.popper = this._getOffsets(this._popper, this._reference, data.placement).popper;
        data = this.runModifiers(data, this._options.modifiers, this._flip);
      }
    }.bind(this));
    return data;
  };
  /**
   * Modifier used to add an offset to the popper, useful if you more granularity positioning your popper.
   * The offsets will shift the popper on the side of its reference element.
   * @method
   * @memberof Popper.modifiers
   * @argument {Object} data - The data object generated by _update method
   * @returns {Object} The data object, properly modified
   */


  Popper$1.prototype.modifiers.offset = function (data) {
    var offset = this._options.offset;
    var popper = data.offsets.popper;

    if (data.placement.indexOf('left') !== -1) {
      popper.top -= offset;
    } else if (data.placement.indexOf('right') !== -1) {
      popper.top += offset;
    } else if (data.placement.indexOf('top') !== -1) {
      popper.left -= offset;
    } else if (data.placement.indexOf('bottom') !== -1) {
      popper.left += offset;
    }

    return data;
  };
  /**
   * Modifier used to move the arrows on the edge of the popper to make sure them are always between the popper and the reference element
   * It will use the CSS outer size of the arrow element to know how many pixels of conjuction are needed
   * @method
   * @memberof Popper.modifiers
   * @argument {Object} data - The data object generated by _update method
   * @returns {Object} The data object, properly modified
   */


  Popper$1.prototype.modifiers.arrow = function (data) {
    var arrow = this._options.arrowElement;
    var arrowOffset = this._options.arrowOffset; // if the arrowElement is a string, suppose it's a CSS selector

    if (typeof arrow === 'string') {
      arrow = this._popper.querySelector(arrow);
    } // if arrow element is not found, don't run the modifier


    if (!arrow) {
      return data;
    } // the arrow element must be child of its popper


    if (!this._popper.contains(arrow)) {
      console.warn('WARNING: `arrowElement` must be child of its popper element!');
      return data;
    } // arrow depends on keepTogether in order to work


    if (!this.isModifierRequired(this.modifiers.arrow, this.modifiers.keepTogether)) {
      console.warn('WARNING: keepTogether modifier is required by arrow modifier in order to work, be sure to include it before arrow!');
      return data;
    }

    var arrowStyle = {};
    var placement = data.placement.split('-')[0];
    var popper = getPopperClientRect(data.offsets.popper);
    var reference = data.offsets.reference;
    var isVertical = ['left', 'right'].indexOf(placement) !== -1;
    var len = isVertical ? 'height' : 'width';
    var side = isVertical ? 'top' : 'left';
    var altSide = isVertical ? 'left' : 'top';
    var opSide = isVertical ? 'bottom' : 'right';
    var arrowSize = getOuterSizes(arrow)[len]; //
    // extends keepTogether behavior making sure the popper and its reference have enough pixels in conjuction
    //
    // top/left side

    if (reference[opSide] - arrowSize < popper[side]) {
      data.offsets.popper[side] -= popper[side] - (reference[opSide] - arrowSize);
    } // bottom/right side


    if (reference[side] + arrowSize > popper[opSide]) {
      data.offsets.popper[side] += reference[side] + arrowSize - popper[opSide];
    } // compute center of the popper


    var center = reference[side] + (arrowOffset || reference[len] / 2 - arrowSize / 2);
    var sideValue = center - popper[side]; // prevent arrow from being placed not contiguously to its popper

    sideValue = Math.max(Math.min(popper[len] - arrowSize - 8, sideValue), 8);
    arrowStyle[side] = sideValue;
    arrowStyle[altSide] = ''; // make sure to remove any old style from the arrow

    data.offsets.arrow = arrowStyle;
    data.arrowElement = arrow;
    return data;
  }; //
  // Helpers
  //

  /**
   * Get the outer sizes of the given element (offset size + margins)
   * @function
   * @ignore
   * @argument {Element} element
   * @returns {Object} object containing width and height properties
   */


  function getOuterSizes(element) {
    // NOTE: 1 DOM access here
    var _display = element.style.display,
        _visibility = element.style.visibility;
    element.style.display = 'block';
    element.style.visibility = 'hidden'; // original method

    var styles = root$1.getComputedStyle(element);
    var x = parseFloat(styles.marginTop) + parseFloat(styles.marginBottom);
    var y = parseFloat(styles.marginLeft) + parseFloat(styles.marginRight);
    var result = {
      width: element.offsetWidth + y,
      height: element.offsetHeight + x
    }; // reset element styles

    element.style.display = _display;
    element.style.visibility = _visibility;
    return result;
  }
  /**
   * Get the opposite placement of the given one/
   * @function
   * @ignore
   * @argument {String} placement
   * @returns {String} flipped placement
   */


  function getOppositePlacement(placement) {
    var hash = {
      left: 'right',
      right: 'left',
      bottom: 'top',
      top: 'bottom'
    };
    return placement.replace(/left|right|bottom|top/g, function (matched) {
      return hash[matched];
    });
  }
  /**
   * Given the popper offsets, generate an output similar to getBoundingClientRect
   * @function
   * @ignore
   * @argument {Object} popperOffsets
   * @returns {Object} ClientRect like output
   */


  function getPopperClientRect(popperOffsets) {
    var offsets = Object.assign({}, popperOffsets);
    offsets.right = offsets.left + offsets.width;
    offsets.bottom = offsets.top + offsets.height;
    return offsets;
  }
  /**
   * Given an array and the key to find, returns its index
   * @function
   * @ignore
   * @argument {Array} arr
   * @argument keyToFind
   * @returns index or null
   */


  function getArrayKeyIndex(arr, keyToFind) {
    var i = 0,
        key;

    for (key in arr) {
      if (arr[key] === keyToFind) {
        return i;
      }

      i++;
    }

    return null;
  }
  /**
   * Get CSS computed property of the given element
   * @function
   * @ignore
   * @argument {Eement} element
   * @argument {String} property
   */


  function getStyleComputedProperty$1(element, property) {
    // NOTE: 1 DOM access here
    var css = root$1.getComputedStyle(element, null);
    return css[property];
  }
  /**
   * Returns the offset parent of the given element
   * @function
   * @ignore
   * @argument {Element} element
   * @returns {Element} offset parent
   */


  function getOffsetParent(element) {
    // NOTE: 1 DOM access here
    var offsetParent = element.offsetParent;
    return offsetParent === root$1.document.body || !offsetParent ? root$1.document.documentElement : offsetParent;
  }
  /**
   * Returns the scrolling parent of the given element
   * @function
   * @ignore
   * @argument {Element} element
   * @returns {Element} offset parent
   */


  function getScrollParent(element) {
    var parent = element.parentNode;

    if (!parent) {
      return element;
    }

    if (parent === root$1.document) {
      // Firefox puts the scrollTOp value on `documentElement` instead of `body`, we then check which of them is
      // greater than 0 and return the proper element
      if (root$1.document.body.scrollTop || root$1.document.body.scrollLeft) {
        return root$1.document.body;
      } else {
        return root$1.document.documentElement;
      }
    } // Firefox want us to check `-x` and `-y` variations as well


    if (['scroll', 'auto'].indexOf(getStyleComputedProperty$1(parent, 'overflow')) !== -1 || ['scroll', 'auto'].indexOf(getStyleComputedProperty$1(parent, 'overflow-x')) !== -1 || ['scroll', 'auto'].indexOf(getStyleComputedProperty$1(parent, 'overflow-y')) !== -1) {
      // If the detected scrollParent is body, we perform an additional check on its parentNode
      // in this way we'll get body if the browser is Chrome-ish, or documentElement otherwise
      // fixes issue #65
      return parent;
    }

    return getScrollParent(element.parentNode);
  }
  /**
   * Check if the given element is fixed or is inside a fixed parent
   * @function
   * @ignore
   * @argument {Element} element
   * @argument {Element} customContainer
   * @returns {Boolean} answer to "isFixed?"
   */


  function isFixed(element) {
    if (element === root$1.document.body) {
      return false;
    }

    if (getStyleComputedProperty$1(element, 'position') === 'fixed') {
      return true;
    }

    return element.parentNode ? isFixed(element.parentNode) : element;
  }
  /**
   * Set the style to the given popper
   * @function
   * @ignore
   * @argument {Element} element - Element to apply the style to
   * @argument {Object} styles - Object with a list of properties and values which will be applied to the element
   */


  function setStyle(element, styles) {
    function is_numeric(n) {
      return n !== '' && !isNaN(parseFloat(n)) && isFinite(n);
    }

    Object.keys(styles).forEach(function (prop) {
      var unit = ''; // add unit if the value is numeric and is one of the following

      if (['width', 'height', 'top', 'right', 'bottom', 'left'].indexOf(prop) !== -1 && is_numeric(styles[prop])) {
        unit = 'px';
      }

      element.style[prop] = styles[prop] + unit;
    });
  }
  /**
   * Check if the given variable is a function
   * @function
   * @ignore
   * @argument {*} functionToCheck - variable to check
   * @returns {Boolean} answer to: is a function?
   */


  function isFunction(functionToCheck) {
    var getType = {};
    return functionToCheck && getType.toString.call(functionToCheck) === '[object Function]';
  }
  /**
   * Get the position of the given element, relative to its offset parent
   * @function
   * @ignore
   * @param {Element} element
   * @return {Object} position - Coordinates of the element and its `scrollTop`
   */


  function getOffsetRect(element) {
    var elementRect = {
      width: element.offsetWidth,
      height: element.offsetHeight,
      left: element.offsetLeft,
      top: element.offsetTop
    };
    elementRect.right = elementRect.left + elementRect.width;
    elementRect.bottom = elementRect.top + elementRect.height; // position

    return elementRect;
  }
  /**
   * Get bounding client rect of given element
   * @function
   * @ignore
   * @param {HTMLElement} element
   * @return {Object} client rect
   */


  function getBoundingClientRect(element) {
    var rect = element.getBoundingClientRect(); // whether the IE version is lower than 11

    var isIE = navigator.userAgent.indexOf('MSIE') != -1; // fix ie document bounding top always 0 bug

    var rectTop = isIE && element.tagName === 'HTML' ? -element.scrollTop : rect.top;
    return {
      left: rect.left,
      top: rectTop,
      right: rect.right,
      bottom: rect.bottom,
      width: rect.right - rect.left,
      height: rect.bottom - rectTop
    };
  }
  /**
   * Given an element and one of its parents, return the offset
   * @function
   * @ignore
   * @param {HTMLElement} element
   * @param {HTMLElement} parent
   * @return {Object} rect
   */


  function getOffsetRectRelativeToCustomParent(element, parent, fixed) {
    var elementRect = getBoundingClientRect(element);
    var parentRect = getBoundingClientRect(parent);

    if (fixed) {
      var scrollParent = getScrollParent(parent);
      parentRect.top += scrollParent.scrollTop;
      parentRect.bottom += scrollParent.scrollTop;
      parentRect.left += scrollParent.scrollLeft;
      parentRect.right += scrollParent.scrollLeft;
    }

    var rect = {
      top: elementRect.top - parentRect.top,
      left: elementRect.left - parentRect.left,
      bottom: elementRect.top - parentRect.top + elementRect.height,
      right: elementRect.left - parentRect.left + elementRect.width,
      width: elementRect.width,
      height: elementRect.height
    };
    return rect;
  }
  /**
   * Get the prefixed supported property name
   * @function
   * @ignore
   * @argument {String} property (camelCase)
   * @returns {String} prefixed property (camelCase)
   */


  function getSupportedPropertyName(property) {
    var prefixes = ['', 'ms', 'webkit', 'moz', 'o'];

    for (var i = 0; i < prefixes.length; i++) {
      var toCheck = prefixes[i] ? prefixes[i] + property.charAt(0).toUpperCase() + property.slice(1) : property;

      if (typeof root$1.document.body.style[toCheck] !== 'undefined') {
        return toCheck;
      }
    }

    return null;
  }
  /**
   * The Object.assign() method is used to copy the values of all enumerable own properties from one or more source
   * objects to a target object. It will return the target object.
   * This polyfill doesn't support symbol properties, since ES5 doesn't have symbols anyway
   * Source: https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/assign
   * @function
   * @ignore
   */


  if (!Object.assign) {
    Object.defineProperty(Object, 'assign', {
      enumerable: false,
      configurable: true,
      writable: true,
      value: function (target) {
        if (target === undefined || target === null) {
          throw new TypeError('Cannot convert first argument to object');
        }

        var to = Object(target);

        for (var i = 1; i < arguments.length; i++) {
          var nextSource = arguments[i];

          if (nextSource === undefined || nextSource === null) {
            continue;
          }

          nextSource = Object(nextSource);
          var keysArray = Object.keys(nextSource);

          for (var nextIndex = 0, len = keysArray.length; nextIndex < len; nextIndex++) {
            var nextKey = keysArray[nextIndex];
            var desc = Object.getOwnPropertyDescriptor(nextSource, nextKey);

            if (desc !== undefined && desc.enumerable) {
              to[nextKey] = nextSource[nextKey];
            }
          }
        }

        return to;
      }
    });
  }

  const stop$2 = e => e.stopPropagation();

  const popperProps = {
    transformOrigin: {
      type: [Boolean, String],
      default: true
    },
    placement: {
      type: String,
      default: 'bottom'
    },
    boundariesPadding: {
      type: Number,
      default: 5
    },
    reference: {},
    popper: {},
    offset: {
      default: 0
    },
    modelValue: Boolean,
    visibleArrow: Boolean,
    arrowOffset: {
      type: Number,
      default: 35
    },
    appendToBody: {
      type: Boolean,
      default: true
    },
    popperOptions: {
      type: Object,

      default() {
        return {
          gpuAcceleration: false
        };
      }

    },
    disabled: {
      type: Boolean,
      default: false
    }
  };

  function usePopper(props, {
    emit,
    slots
  }, {
    referenceElm,
    popperElm
  }) {
    const {
      transformOrigin,
      placement,
      reference,
      popper,
      offset,
      modelValue,
      visibleArrow,
      arrowOffset,
      appendToBody,
      popperOptions,
      disabled
    } = vue.toRefs(props);
    const showPopper = vue.ref(false);
    const currentPlacement = vue.ref('');
    const popperJS = vue.ref(null);
    const instance = vue.getCurrentInstance();

    function createPopper() {
      if (instance.proxy.$isServer) return;
      currentPlacement.value = currentPlacement.value || placement.value;

      if (!/^(top|bottom|left|right)(-start|-end)?$/g.test(currentPlacement.value)) {
        return;
      }

      const options = popperOptions.value;
      const popperRef = popperElm.value = popperElm.value || popper && popper.value || instance.proxy.$refs.popper;
      let referenceRef = referenceElm.value = referenceElm.value || reference && reference.value || instance.proxy.$refs.reference;

      if (!referenceRef && slots.reference && slots.reference() && slots.reference()[0]) {
        referenceRef = referenceElm.value = slots.reference()[0].el;
      }

      if (!popperRef || !referenceRef) return;
      if (visibleArrow.value) appendArrow(popperRef);
      if (appendToBody.value) document.body.appendChild(popperElm.value);

      if (popperJS.value && popperJS.value.destroy) {
        popperJS.value.destroy();
      }

      options.placement = currentPlacement.value;
      options.offset = offset.value;
      options.arrowOffset = arrowOffset.value;
      popperJS.value = new Popper$1(referenceRef, popperRef, options);
      popperJS.value.onCreate(() => {
        emit('created', instance.proxy);
        resetTransformOrigin();
        vue.nextTick(() => updatePopper());
      });

      if (typeof options.onUpdate === 'function') {
        popperJS.value.onUpdate(options.onUpdate);
      }

      popperJS.value._popper.style.zIndex = PopupManager.nextZIndex();
      popperElm.value.addEventListener('click', stop$2);
    }

    function updatePopper() {
      const popperJSRef = popperJS.value;

      if (popperJSRef) {
        popperJSRef.update();

        if (popperJSRef._popper) {
          popperJSRef._popper.style.zIndex = PopupManager.nextZIndex();
        }
      } else {
        createPopper();
      }
    }

    function doDestroy(forceDestroy) {
      /* istanbul ignore if */
      if (!popperJS.value || showPopper.value && !forceDestroy) return;
      popperJS.value.destroy();
      popperJS.value = null;
    }

    function destroyPopper() {
      if (popperJS.value) {
        resetTransformOrigin();
      }
    }

    function resetTransformOrigin() {
      if (!transformOrigin.value) return;
      const placementMap = {
        top: 'bottom',
        bottom: 'top',
        left: 'right',
        right: 'left'
      };

      const placement = popperJS.value._popper.getAttribute('x-placement').split('-')[0];

      const origin = placementMap[placement];
      popperJS.value._popper.style.transformOrigin = typeof transformOrigin.value === 'string' ? transformOrigin.value : ['top', 'bottom'].indexOf(placement) > -1 ? `center ${origin}` : `${origin} center`;
    }

    const appended = vue.ref(false);

    function appendArrow(element) {
      let hash;

      if (appended.value) {
        return;
      }

      appended.value = true;

      for (const item in element.attributes) {
        if (/^_v-/.test(element.attributes[item].name)) {
          hash = element.attributes[item].name;
          break;
        }
      }

      const arrow = document.createElement('div');

      if (hash) {
        arrow.setAttribute(hash, '');
      }

      arrow.setAttribute('x-arrow', '');
      arrow.className = 'popper__arrow';
      element.appendChild(arrow);
    }

    vue.watch(modelValue, val => {
      showPopper.value = val;
      emit('update:modelValue', val);
    }, {
      immediate: true
    });
    vue.watch(showPopper, val => {
      if (disabled.value) return;
      val ? updatePopper() : destroyPopper();
      emit('update:modelValue', val);
    });
    vue.onBeforeUnmount(() => {
      doDestroy(true);

      if (popperElm.value && popperElm.value.parentNode === document.body) {
        popperElm.value.removeEventListener('click', stop$2);
        document.body.removeChild(popperElm.value);
      }
    });
    return {
      showPopper,
      currentPlacement,
      referenceElm,
      popperElm,
      popperJS,
      createPopper,
      updatePopper,
      doDestroy,
      destroyPopper,
      resetTransformOrigin,
      appendArrow
    };
  }

  var script$1j = {
    name: 'ElSelectDropdown',
    componentName: 'ElSelectDropdown',
    props: { ...popperProps,
      placement: {
        default: 'bottom-start'
      },
      boundariesPadding: {
        default: 0
      },
      popperOptions: {
        default() {
          return {
            gpuAcceleration: false
          };
        }

      },
      visibleArrow: {
        default: true
      },
      appendToBody: {
        type: Boolean,
        default: true
      }
    },
    emits: ['update:blur', 'update:modelValue', 'created'],

    setup(props, ctx) {
      const elSelect = vue.inject('select');
      const elms = usePopperElm(elSelect);
      const popper = usePopper(props, ctx, elms);
      usePopperUpdate(() => {
        if (elSelect.visible) {
          popper.updatePopper();
        }
      }, popper.destroyPopper);
      const popperClass = vue.computed(() => {
        return elSelect.popperClass;
      });
      const minWidth = useMinWidth(elSelect);
      return {
        elSelect,
        minWidth,
        popperClass,
        ...popper
      };
    }

  };

  function usePopperElm(elSelect) {
    const {
      proxy
    } = vue.getCurrentInstance();
    const elms = vue.reactive({
      referenceElm: null,
      popperElm: null
    });
    vue.onMounted(() => {
      elms.referenceElm = elSelect.$refs.reference.$el;
      elSelect.popperElm = elms.popperElm = proxy.$el;
    });
    return { ...vue.toRefs(elms)
    };
  }

  function usePopperUpdate(updateFn, destroyFn) {
    const {
      on
    } = useEmitter();
    vue.onMounted(() => {
      on('updatePopper', updateFn);
      on('destroyPopper', destroyFn);
    });
  }

  function useMinWidth(elSelect) {
    const minWidth = vue.ref('');
    vue.watch(() => elSelect.inputWidth, () => {
      minWidth.value = elSelect.$el.getBoundingClientRect().width + 'px';
    });
    return minWidth;
  }

  function render$19(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("div", {
      class: ["el-select-dropdown el-popper", [{
        'is-multiple': $setup.elSelect.multiple
      }, $setup.popperClass]],
      style: {
        minWidth: $setup.minWidth
      }
    }, [vue.renderSlot(_ctx.$slots, "default")], 6
    /* CLASS, STYLE */
    );
  }

  script$1j.render = render$19;
  script$1j.__file = "packages/select/SelectDropdown.vue";

  var script$1i = {
    name: 'ElOption',
    componentName: 'ElOption',
    props: {
      value: {
        required: true
      },
      label: [String, Number],
      created: Boolean,
      disabled: {
        type: Boolean,
        default: false
      }
    },

    setup(props) {
      const {
        on,
        dispatch
      } = useEmitter();
      const select = vue.inject('select');
      const {
        proxy
      } = vue.getCurrentInstance();
      const {
        value,
        label,
        disabled,
        created
      } = vue.toRefs(props);
      const data = vue.reactive({
        index: -1,
        groupDisabled: false,
        visible: true,
        hitState: false,
        hover: false
      });
      const isObject = vue.computed(() => {
        const v = vue.unref(value);
        return Object.prototype.toString.call(v).toLowerCase() === '[object object]';
      });
      const currentLabel = vue.computed(() => {
        return vue.unref(label) || (vue.unref(isObject) ? '' : vue.unref(value));
      });
      const currentValue = vue.computed(() => {
        return vue.unref(value) || label.value || '';
      });
      const itemSelected = vue.computed(() => {
        if (!select.multiple) {
          return isEqual(vue.unref(value), select.modelValue);
        } else {
          return contains(select.modelValue, vue.unref(value));
        }
      });
      const limitReached = vue.computed(() => {
        if (select.multiple) {
          return !vue.unref(itemSelected) && (select.modelValue || []).length >= select.multipleLimit && select.multipleLimit > 0;
        } else {
          return false;
        }
      });

      function isEqual(a, b) {
        if (!vue.unref(isObject)) {
          return a === b;
        } else {
          const valueKey = select.valueKey;
          return getValueByPath(a, valueKey) === getValueByPath(b, valueKey);
        }
      }

      function contains(arr = [], target) {
        if (!vue.unref(isObject)) {
          return arr && arr.indexOf(target) > -1;
        } else {
          const valueKey = select.valueKey;
          return arr && arr.some(item => {
            return getValueByPath(item, valueKey) === getValueByPath(target, valueKey);
          });
        }
      }

      function handleGroupDisabled(val) {
        data.groupDisabled = val;
      }

      function hoverItem() {
        if (!disabled.value && !data.groupDisabled) {
          select.hoverIndex = select.options.indexOf(proxy);
        }
      }

      function selectOptionClick() {
        if (disabled.value !== true && data.groupDisabled !== true) {
          dispatch('handleOptionClick', {
            option: props,
            byClick: true
          });
        }
      }

      function queryChange(query) {
        data.visible = new RegExp(escapeRegexpString(query), 'i').test(vue.unref(currentLabel)) || created.value;

        if (!data.visible) {
          select.filteredOptionsCount--;
        }
      }

      vue.watch(currentLabel, () => {
        if (!created.value && !select.remote) dispatch('setSelected');
      });
      vue.watch(value, (val, oldVal) => {
        const {
          remote,
          valueKey
        } = select;

        if (!created.value && !remote) {
          if (valueKey && typeof val === 'object' && typeof oldVal === 'object' && val[valueKey] === oldVal[valueKey]) {
            return;
          }

          dispatch('setSelected');
        }
      });
      vue.onBeforeMount(() => {
        select.options.push(proxy);
        select.cachedOptions.push(proxy);
        select.optionsCount++;
        select.filteredOptionsCount++;
        on('queryChange', queryChange);
        on('handleGroupDisabled', handleGroupDisabled);
      });
      vue.onBeforeUnmount(() => {
        const {
          selected,
          multiple
        } = select;
        const selectedOptions = multiple ? selected : [selected];
        const index = select.cachedOptions.indexOf(proxy);
        const selectedIndex = selectedOptions.indexOf(proxy); // if option is not selected, remove it from cache

        if (index > -1 && selectedIndex < 0) {
          select.cachedOptions.splice(index, 1);
        }

        select.onOptionDestroy(select.options.indexOf(proxy));
      });
      return { ...vue.toRefs(data),
        selectOptionClick,
        itemSelected,
        limitReached,
        currentLabel,
        currentValue,
        hoverItem
      };
    }

  };

  function render$18(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.withDirectives((vue.openBlock(), vue.createBlock("li", {
      onMouseenter: _cache[1] || (_cache[1] = (...args) => $setup.hoverItem && $setup.hoverItem(...args)),
      onClick: _cache[2] || (_cache[2] = vue.withModifiers((...args) => $setup.selectOptionClick && $setup.selectOptionClick(...args), ["stop"])),
      class: ["el-select-dropdown__item", {
        selected: $setup.itemSelected,
        'is-disabled': $props.disabled || _ctx.groupDisabled || $setup.limitReached,
        hover: _ctx.hover
      }]
    }, [vue.renderSlot(_ctx.$slots, "default", {}, () => [vue.createVNode("span", null, vue.toDisplayString($setup.currentLabel), 1
    /* TEXT */
    )])], 34
    /* CLASS, HYDRATE_EVENTS */
    )), [[vue.vShow, _ctx.visible]]);
  }

  script$1i.render = render$18;
  script$1i.__file = "packages/option/Option.vue";

  function _isSlot$3(s) {
    return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !vue.isVNode(s);
  }

  const useShow$1 = emit => {
    const show = vue.ref(true);

    const handleClose = e => {
      e.stopPropagation();
      show.value = false;
      emit('close', e);
    };

    return {
      show,
      handleClose
    };
  };

  var script$1h = {
    name: 'ElTag',
    props: {
      type: {
        type: String,
        default: '',

        validator(v) {
          return ['success', 'info', 'warning', 'danger', ''].includes(v);
        }

      },
      closable: Boolean,
      disableTransitions: Boolean,
      hit: Boolean,
      color: String,
      size: {
        type: String,

        validator(v) {
          return ['medium', 'small', 'mini', ''].includes(v);
        }

      },
      effect: {
        type: String,
        default: 'light',

        validator(v) {
          return ['dark', 'light', 'plain'].includes(v);
        }

      }
    },
    emits: ['close', 'click'],

    setup(props, {
      emit
    }) {
      const $ELEMENT = useGlobalOptions();
      const {
        type,
        hit,
        size,
        effect
      } = vue.toRefs(props);
      const tagSize = vue.computed(() => {
        return (size === null || size === void 0 ? void 0 : size.value) || $ELEMENT.size;
      });
      const classes = vue.computed(() => ['el-tag', type.value ? `el-tag--${type.value}` : '', tagSize.value ? `el-tag--${tagSize.value}` : '', `el-tag--${effect.value}`, hit.value && 'is-hit']);
      const {
        show,
        handleClose
      } = useShow$1(emit);
      return {
        show,
        classes,
        handleClose
      };
    },

    render() {
      var _this$$slots$default, _this$$slots;

      const tagEl = this.show ? vue.createVNode("span", {
        "class": this.classes,
        "style": {
          backgroundColor: this.color
        },
        "onClick": e => {
          this.$emit('click', e);
        }
      }, [(_this$$slots$default = (_this$$slots = this.$slots).default) === null || _this$$slots$default === void 0 ? void 0 : _this$$slots$default.call(_this$$slots), this.closable && vue.createVNode("i", {
        "class": "el-tag__close el-icon-close",
        "onClick": this.handleClose
      }, null)]) : '';
      return this.disableTransitions ? tagEl : vue.createVNode(vue.Transition, {
        "appear": true,
        "name": "el-zoom-in-center"
      }, _isSlot$3(tagEl) ? tagEl : {
        default: () => [tagEl]
      });
    }

  };

  script$1h.__file = "src/components/Tag/src/Tag.vue";

  /* istanbul ignore next */

  script$1h.install = function (app) {
    app.component(script$1h.name, script$1h);
  };

  /**
   * A collection of shims that provide minimal functionality of the ES6 collections.
   *
   * These implementations are not meant to be used outside of the ResizeObserver
   * modules as they cover only a limited range of use cases.
   */

  /* eslint-disable require-jsdoc, valid-jsdoc */
  var MapShim = function () {
    if (typeof Map !== 'undefined') {
      return Map;
    }
    /**
     * Returns index in provided array that matches the specified key.
     *
     * @param {Array<Array>} arr
     * @param {*} key
     * @returns {number}
     */


    function getIndex(arr, key) {
      var result = -1;
      arr.some(function (entry, index) {
        if (entry[0] === key) {
          result = index;
          return true;
        }

        return false;
      });
      return result;
    }

    return (
      /** @class */
      function () {
        function class_1() {
          this.__entries__ = [];
        }

        Object.defineProperty(class_1.prototype, "size", {
          /**
           * @returns {boolean}
           */
          get: function () {
            return this.__entries__.length;
          },
          enumerable: true,
          configurable: true
        });
        /**
         * @param {*} key
         * @returns {*}
         */

        class_1.prototype.get = function (key) {
          var index = getIndex(this.__entries__, key);
          var entry = this.__entries__[index];
          return entry && entry[1];
        };
        /**
         * @param {*} key
         * @param {*} value
         * @returns {void}
         */


        class_1.prototype.set = function (key, value) {
          var index = getIndex(this.__entries__, key);

          if (~index) {
            this.__entries__[index][1] = value;
          } else {
            this.__entries__.push([key, value]);
          }
        };
        /**
         * @param {*} key
         * @returns {void}
         */


        class_1.prototype.delete = function (key) {
          var entries = this.__entries__;
          var index = getIndex(entries, key);

          if (~index) {
            entries.splice(index, 1);
          }
        };
        /**
         * @param {*} key
         * @returns {void}
         */


        class_1.prototype.has = function (key) {
          return !!~getIndex(this.__entries__, key);
        };
        /**
         * @returns {void}
         */


        class_1.prototype.clear = function () {
          this.__entries__.splice(0);
        };
        /**
         * @param {Function} callback
         * @param {*} [ctx=null]
         * @returns {void}
         */


        class_1.prototype.forEach = function (callback, ctx) {
          if (ctx === void 0) {
            ctx = null;
          }

          for (var _i = 0, _a = this.__entries__; _i < _a.length; _i++) {
            var entry = _a[_i];
            callback.call(ctx, entry[1], entry[0]);
          }
        };

        return class_1;
      }()
    );
  }();
  /**
   * Detects whether window and document objects are available in current environment.
   */


  var isBrowser = typeof window !== 'undefined' && typeof document !== 'undefined' && window.document === document; // Returns global object of a current environment.

  var global$1 = function () {
    if (typeof global !== 'undefined' && global.Math === Math) {
      return global;
    }

    if (typeof self !== 'undefined' && self.Math === Math) {
      return self;
    }

    if (typeof window !== 'undefined' && window.Math === Math) {
      return window;
    } // eslint-disable-next-line no-new-func


    return Function('return this')();
  }();
  /**
   * A shim for the requestAnimationFrame which falls back to the setTimeout if
   * first one is not supported.
   *
   * @returns {number} Requests' identifier.
   */


  var requestAnimationFrame$1 = function () {
    if (typeof requestAnimationFrame === 'function') {
      // It's required to use a bounded function because IE sometimes throws
      // an "Invalid calling object" error if rAF is invoked without the global
      // object on the left hand side.
      return requestAnimationFrame.bind(global$1);
    }

    return function (callback) {
      return setTimeout(function () {
        return callback(Date.now());
      }, 1000 / 60);
    };
  }(); // Defines minimum timeout before adding a trailing call.


  var trailingTimeout = 2;
  /**
   * Creates a wrapper function which ensures that provided callback will be
   * invoked only once during the specified delay period.
   *
   * @param {Function} callback - Function to be invoked after the delay period.
   * @param {number} delay - Delay after which to invoke callback.
   * @returns {Function}
   */

  function throttle$2(callback, delay) {
    var leadingCall = false,
        trailingCall = false,
        lastCallTime = 0;
    /**
     * Invokes the original callback function and schedules new invocation if
     * the "proxy" was called during current request.
     *
     * @returns {void}
     */

    function resolvePending() {
      if (leadingCall) {
        leadingCall = false;
        callback();
      }

      if (trailingCall) {
        proxy();
      }
    }
    /**
     * Callback invoked after the specified delay. It will further postpone
     * invocation of the original function delegating it to the
     * requestAnimationFrame.
     *
     * @returns {void}
     */


    function timeoutCallback() {
      requestAnimationFrame$1(resolvePending);
    }
    /**
     * Schedules invocation of the original function.
     *
     * @returns {void}
     */


    function proxy() {
      var timeStamp = Date.now();

      if (leadingCall) {
        // Reject immediately following calls.
        if (timeStamp - lastCallTime < trailingTimeout) {
          return;
        } // Schedule new call to be in invoked when the pending one is resolved.
        // This is important for "transitions" which never actually start
        // immediately so there is a chance that we might miss one if change
        // happens amids the pending invocation.


        trailingCall = true;
      } else {
        leadingCall = true;
        trailingCall = false;
        setTimeout(timeoutCallback, delay);
      }

      lastCallTime = timeStamp;
    }

    return proxy;
  } // Minimum delay before invoking the update of observers.


  var REFRESH_DELAY = 20; // A list of substrings of CSS properties used to find transition events that
  // might affect dimensions of observed elements.

  var transitionKeys = ['top', 'right', 'bottom', 'left', 'width', 'height', 'size', 'weight']; // Check if MutationObserver is available.

  var mutationObserverSupported = typeof MutationObserver !== 'undefined';
  /**
   * Singleton controller class which handles updates of ResizeObserver instances.
   */

  var ResizeObserverController =
  /** @class */
  function () {
    /**
     * Creates a new instance of ResizeObserverController.
     *
     * @private
     */
    function ResizeObserverController() {
      /**
       * Indicates whether DOM listeners have been added.
       *
       * @private {boolean}
       */
      this.connected_ = false;
      /**
       * Tells that controller has subscribed for Mutation Events.
       *
       * @private {boolean}
       */

      this.mutationEventsAdded_ = false;
      /**
       * Keeps reference to the instance of MutationObserver.
       *
       * @private {MutationObserver}
       */

      this.mutationsObserver_ = null;
      /**
       * A list of connected observers.
       *
       * @private {Array<ResizeObserverSPI>}
       */

      this.observers_ = [];
      this.onTransitionEnd_ = this.onTransitionEnd_.bind(this);
      this.refresh = throttle$2(this.refresh.bind(this), REFRESH_DELAY);
    }
    /**
     * Adds observer to observers list.
     *
     * @param {ResizeObserverSPI} observer - Observer to be added.
     * @returns {void}
     */


    ResizeObserverController.prototype.addObserver = function (observer) {
      if (!~this.observers_.indexOf(observer)) {
        this.observers_.push(observer);
      } // Add listeners if they haven't been added yet.


      if (!this.connected_) {
        this.connect_();
      }
    };
    /**
     * Removes observer from observers list.
     *
     * @param {ResizeObserverSPI} observer - Observer to be removed.
     * @returns {void}
     */


    ResizeObserverController.prototype.removeObserver = function (observer) {
      var observers = this.observers_;
      var index = observers.indexOf(observer); // Remove observer if it's present in registry.

      if (~index) {
        observers.splice(index, 1);
      } // Remove listeners if controller has no connected observers.


      if (!observers.length && this.connected_) {
        this.disconnect_();
      }
    };
    /**
     * Invokes the update of observers. It will continue running updates insofar
     * it detects changes.
     *
     * @returns {void}
     */


    ResizeObserverController.prototype.refresh = function () {
      var changesDetected = this.updateObservers_(); // Continue running updates if changes have been detected as there might
      // be future ones caused by CSS transitions.

      if (changesDetected) {
        this.refresh();
      }
    };
    /**
     * Updates every observer from observers list and notifies them of queued
     * entries.
     *
     * @private
     * @returns {boolean} Returns "true" if any observer has detected changes in
     *      dimensions of it's elements.
     */


    ResizeObserverController.prototype.updateObservers_ = function () {
      // Collect observers that have active observations.
      var activeObservers = this.observers_.filter(function (observer) {
        return observer.gatherActive(), observer.hasActive();
      }); // Deliver notifications in a separate cycle in order to avoid any
      // collisions between observers, e.g. when multiple instances of
      // ResizeObserver are tracking the same element and the callback of one
      // of them changes content dimensions of the observed target. Sometimes
      // this may result in notifications being blocked for the rest of observers.

      activeObservers.forEach(function (observer) {
        return observer.broadcastActive();
      });
      return activeObservers.length > 0;
    };
    /**
     * Initializes DOM listeners.
     *
     * @private
     * @returns {void}
     */


    ResizeObserverController.prototype.connect_ = function () {
      // Do nothing if running in a non-browser environment or if listeners
      // have been already added.
      if (!isBrowser || this.connected_) {
        return;
      } // Subscription to the "Transitionend" event is used as a workaround for
      // delayed transitions. This way it's possible to capture at least the
      // final state of an element.


      document.addEventListener('transitionend', this.onTransitionEnd_);
      window.addEventListener('resize', this.refresh);

      if (mutationObserverSupported) {
        this.mutationsObserver_ = new MutationObserver(this.refresh);
        this.mutationsObserver_.observe(document, {
          attributes: true,
          childList: true,
          characterData: true,
          subtree: true
        });
      } else {
        document.addEventListener('DOMSubtreeModified', this.refresh);
        this.mutationEventsAdded_ = true;
      }

      this.connected_ = true;
    };
    /**
     * Removes DOM listeners.
     *
     * @private
     * @returns {void}
     */


    ResizeObserverController.prototype.disconnect_ = function () {
      // Do nothing if running in a non-browser environment or if listeners
      // have been already removed.
      if (!isBrowser || !this.connected_) {
        return;
      }

      document.removeEventListener('transitionend', this.onTransitionEnd_);
      window.removeEventListener('resize', this.refresh);

      if (this.mutationsObserver_) {
        this.mutationsObserver_.disconnect();
      }

      if (this.mutationEventsAdded_) {
        document.removeEventListener('DOMSubtreeModified', this.refresh);
      }

      this.mutationsObserver_ = null;
      this.mutationEventsAdded_ = false;
      this.connected_ = false;
    };
    /**
     * "Transitionend" event handler.
     *
     * @private
     * @param {TransitionEvent} event
     * @returns {void}
     */


    ResizeObserverController.prototype.onTransitionEnd_ = function (_a) {
      var _b = _a.propertyName,
          propertyName = _b === void 0 ? '' : _b; // Detect whether transition may affect dimensions of an element.

      var isReflowProperty = transitionKeys.some(function (key) {
        return !!~propertyName.indexOf(key);
      });

      if (isReflowProperty) {
        this.refresh();
      }
    };
    /**
     * Returns instance of the ResizeObserverController.
     *
     * @returns {ResizeObserverController}
     */


    ResizeObserverController.getInstance = function () {
      if (!this.instance_) {
        this.instance_ = new ResizeObserverController();
      }

      return this.instance_;
    };
    /**
     * Holds reference to the controller's instance.
     *
     * @private {ResizeObserverController}
     */


    ResizeObserverController.instance_ = null;
    return ResizeObserverController;
  }();
  /**
   * Defines non-writable/enumerable properties of the provided target object.
   *
   * @param {Object} target - Object for which to define properties.
   * @param {Object} props - Properties to be defined.
   * @returns {Object} Target object.
   */


  var defineConfigurable = function (target, props) {
    for (var _i = 0, _a = Object.keys(props); _i < _a.length; _i++) {
      var key = _a[_i];
      Object.defineProperty(target, key, {
        value: props[key],
        enumerable: false,
        writable: false,
        configurable: true
      });
    }

    return target;
  };
  /**
   * Returns the global object associated with provided element.
   *
   * @param {Object} target
   * @returns {Object}
   */


  var getWindowOf = function (target) {
    // Assume that the element is an instance of Node, which means that it
    // has the "ownerDocument" property from which we can retrieve a
    // corresponding global object.
    var ownerGlobal = target && target.ownerDocument && target.ownerDocument.defaultView; // Return the local global object if it's not possible extract one from
    // provided element.

    return ownerGlobal || global$1;
  }; // Placeholder of an empty content rectangle.


  var emptyRect = createRectInit(0, 0, 0, 0);
  /**
   * Converts provided string to a number.
   *
   * @param {number|string} value
   * @returns {number}
   */

  function toFloat(value) {
    return parseFloat(value) || 0;
  }
  /**
   * Extracts borders size from provided styles.
   *
   * @param {CSSStyleDeclaration} styles
   * @param {...string} positions - Borders positions (top, right, ...)
   * @returns {number}
   */


  function getBordersSize(styles) {
    var positions = [];

    for (var _i = 1; _i < arguments.length; _i++) {
      positions[_i - 1] = arguments[_i];
    }

    return positions.reduce(function (size, position) {
      var value = styles['border-' + position + '-width'];
      return size + toFloat(value);
    }, 0);
  }
  /**
   * Extracts paddings sizes from provided styles.
   *
   * @param {CSSStyleDeclaration} styles
   * @returns {Object} Paddings box.
   */


  function getPaddings(styles) {
    var positions = ['top', 'right', 'bottom', 'left'];
    var paddings = {};

    for (var _i = 0, positions_1 = positions; _i < positions_1.length; _i++) {
      var position = positions_1[_i];
      var value = styles['padding-' + position];
      paddings[position] = toFloat(value);
    }

    return paddings;
  }
  /**
   * Calculates content rectangle of provided SVG element.
   *
   * @param {SVGGraphicsElement} target - Element content rectangle of which needs
   *      to be calculated.
   * @returns {DOMRectInit}
   */


  function getSVGContentRect(target) {
    var bbox = target.getBBox();
    return createRectInit(0, 0, bbox.width, bbox.height);
  }
  /**
   * Calculates content rectangle of provided HTMLElement.
   *
   * @param {HTMLElement} target - Element for which to calculate the content rectangle.
   * @returns {DOMRectInit}
   */


  function getHTMLElementContentRect(target) {
    // Client width & height properties can't be
    // used exclusively as they provide rounded values.
    var clientWidth = target.clientWidth,
        clientHeight = target.clientHeight; // By this condition we can catch all non-replaced inline, hidden and
    // detached elements. Though elements with width & height properties less
    // than 0.5 will be discarded as well.
    //
    // Without it we would need to implement separate methods for each of
    // those cases and it's not possible to perform a precise and performance
    // effective test for hidden elements. E.g. even jQuery's ':visible' filter
    // gives wrong results for elements with width & height less than 0.5.

    if (!clientWidth && !clientHeight) {
      return emptyRect;
    }

    var styles = getWindowOf(target).getComputedStyle(target);
    var paddings = getPaddings(styles);
    var horizPad = paddings.left + paddings.right;
    var vertPad = paddings.top + paddings.bottom; // Computed styles of width & height are being used because they are the
    // only dimensions available to JS that contain non-rounded values. It could
    // be possible to utilize the getBoundingClientRect if only it's data wasn't
    // affected by CSS transformations let alone paddings, borders and scroll bars.

    var width = toFloat(styles.width),
        height = toFloat(styles.height); // Width & height include paddings and borders when the 'border-box' box
    // model is applied (except for IE).

    if (styles.boxSizing === 'border-box') {
      // Following conditions are required to handle Internet Explorer which
      // doesn't include paddings and borders to computed CSS dimensions.
      //
      // We can say that if CSS dimensions + paddings are equal to the "client"
      // properties then it's either IE, and thus we don't need to subtract
      // anything, or an element merely doesn't have paddings/borders styles.
      if (Math.round(width + horizPad) !== clientWidth) {
        width -= getBordersSize(styles, 'left', 'right') + horizPad;
      }

      if (Math.round(height + vertPad) !== clientHeight) {
        height -= getBordersSize(styles, 'top', 'bottom') + vertPad;
      }
    } // Following steps can't be applied to the document's root element as its
    // client[Width/Height] properties represent viewport area of the window.
    // Besides, it's as well not necessary as the <html> itself neither has
    // rendered scroll bars nor it can be clipped.


    if (!isDocumentElement(target)) {
      // In some browsers (only in Firefox, actually) CSS width & height
      // include scroll bars size which can be removed at this step as scroll
      // bars are the only difference between rounded dimensions + paddings
      // and "client" properties, though that is not always true in Chrome.
      var vertScrollbar = Math.round(width + horizPad) - clientWidth;
      var horizScrollbar = Math.round(height + vertPad) - clientHeight; // Chrome has a rather weird rounding of "client" properties.
      // E.g. for an element with content width of 314.2px it sometimes gives
      // the client width of 315px and for the width of 314.7px it may give
      // 314px. And it doesn't happen all the time. So just ignore this delta
      // as a non-relevant.

      if (Math.abs(vertScrollbar) !== 1) {
        width -= vertScrollbar;
      }

      if (Math.abs(horizScrollbar) !== 1) {
        height -= horizScrollbar;
      }
    }

    return createRectInit(paddings.left, paddings.top, width, height);
  }
  /**
   * Checks whether provided element is an instance of the SVGGraphicsElement.
   *
   * @param {Element} target - Element to be checked.
   * @returns {boolean}
   */


  var isSVGGraphicsElement = function () {
    // Some browsers, namely IE and Edge, don't have the SVGGraphicsElement
    // interface.
    if (typeof SVGGraphicsElement !== 'undefined') {
      return function (target) {
        return target instanceof getWindowOf(target).SVGGraphicsElement;
      };
    } // If it's so, then check that element is at least an instance of the
    // SVGElement and that it has the "getBBox" method.
    // eslint-disable-next-line no-extra-parens


    return function (target) {
      return target instanceof getWindowOf(target).SVGElement && typeof target.getBBox === 'function';
    };
  }();
  /**
   * Checks whether provided element is a document element (<html>).
   *
   * @param {Element} target - Element to be checked.
   * @returns {boolean}
   */


  function isDocumentElement(target) {
    return target === getWindowOf(target).document.documentElement;
  }
  /**
   * Calculates an appropriate content rectangle for provided html or svg element.
   *
   * @param {Element} target - Element content rectangle of which needs to be calculated.
   * @returns {DOMRectInit}
   */


  function getContentRect(target) {
    if (!isBrowser) {
      return emptyRect;
    }

    if (isSVGGraphicsElement(target)) {
      return getSVGContentRect(target);
    }

    return getHTMLElementContentRect(target);
  }
  /**
   * Creates rectangle with an interface of the DOMRectReadOnly.
   * Spec: https://drafts.fxtf.org/geometry/#domrectreadonly
   *
   * @param {DOMRectInit} rectInit - Object with rectangle's x/y coordinates and dimensions.
   * @returns {DOMRectReadOnly}
   */


  function createReadOnlyRect(_a) {
    var x = _a.x,
        y = _a.y,
        width = _a.width,
        height = _a.height; // If DOMRectReadOnly is available use it as a prototype for the rectangle.

    var Constr = typeof DOMRectReadOnly !== 'undefined' ? DOMRectReadOnly : Object;
    var rect = Object.create(Constr.prototype); // Rectangle's properties are not writable and non-enumerable.

    defineConfigurable(rect, {
      x: x,
      y: y,
      width: width,
      height: height,
      top: y,
      right: x + width,
      bottom: height + y,
      left: x
    });
    return rect;
  }
  /**
   * Creates DOMRectInit object based on the provided dimensions and the x/y coordinates.
   * Spec: https://drafts.fxtf.org/geometry/#dictdef-domrectinit
   *
   * @param {number} x - X coordinate.
   * @param {number} y - Y coordinate.
   * @param {number} width - Rectangle's width.
   * @param {number} height - Rectangle's height.
   * @returns {DOMRectInit}
   */


  function createRectInit(x, y, width, height) {
    return {
      x: x,
      y: y,
      width: width,
      height: height
    };
  }
  /**
   * Class that is responsible for computations of the content rectangle of
   * provided DOM element and for keeping track of it's changes.
   */


  var ResizeObservation =
  /** @class */
  function () {
    /**
     * Creates an instance of ResizeObservation.
     *
     * @param {Element} target - Element to be observed.
     */
    function ResizeObservation(target) {
      /**
       * Broadcasted width of content rectangle.
       *
       * @type {number}
       */
      this.broadcastWidth = 0;
      /**
       * Broadcasted height of content rectangle.
       *
       * @type {number}
       */

      this.broadcastHeight = 0;
      /**
       * Reference to the last observed content rectangle.
       *
       * @private {DOMRectInit}
       */

      this.contentRect_ = createRectInit(0, 0, 0, 0);
      this.target = target;
    }
    /**
     * Updates content rectangle and tells whether it's width or height properties
     * have changed since the last broadcast.
     *
     * @returns {boolean}
     */


    ResizeObservation.prototype.isActive = function () {
      var rect = getContentRect(this.target);
      this.contentRect_ = rect;
      return rect.width !== this.broadcastWidth || rect.height !== this.broadcastHeight;
    };
    /**
     * Updates 'broadcastWidth' and 'broadcastHeight' properties with a data
     * from the corresponding properties of the last observed content rectangle.
     *
     * @returns {DOMRectInit} Last observed content rectangle.
     */


    ResizeObservation.prototype.broadcastRect = function () {
      var rect = this.contentRect_;
      this.broadcastWidth = rect.width;
      this.broadcastHeight = rect.height;
      return rect;
    };

    return ResizeObservation;
  }();

  var ResizeObserverEntry =
  /** @class */
  function () {
    /**
     * Creates an instance of ResizeObserverEntry.
     *
     * @param {Element} target - Element that is being observed.
     * @param {DOMRectInit} rectInit - Data of the element's content rectangle.
     */
    function ResizeObserverEntry(target, rectInit) {
      var contentRect = createReadOnlyRect(rectInit); // According to the specification following properties are not writable
      // and are also not enumerable in the native implementation.
      //
      // Property accessors are not being used as they'd require to define a
      // private WeakMap storage which may cause memory leaks in browsers that
      // don't support this type of collections.

      defineConfigurable(this, {
        target: target,
        contentRect: contentRect
      });
    }

    return ResizeObserverEntry;
  }();

  var ResizeObserverSPI =
  /** @class */
  function () {
    /**
     * Creates a new instance of ResizeObserver.
     *
     * @param {ResizeObserverCallback} callback - Callback function that is invoked
     *      when one of the observed elements changes it's content dimensions.
     * @param {ResizeObserverController} controller - Controller instance which
     *      is responsible for the updates of observer.
     * @param {ResizeObserver} callbackCtx - Reference to the public
     *      ResizeObserver instance which will be passed to callback function.
     */
    function ResizeObserverSPI(callback, controller, callbackCtx) {
      /**
       * Collection of resize observations that have detected changes in dimensions
       * of elements.
       *
       * @private {Array<ResizeObservation>}
       */
      this.activeObservations_ = [];
      /**
       * Registry of the ResizeObservation instances.
       *
       * @private {Map<Element, ResizeObservation>}
       */

      this.observations_ = new MapShim();

      if (typeof callback !== 'function') {
        throw new TypeError('The callback provided as parameter 1 is not a function.');
      }

      this.callback_ = callback;
      this.controller_ = controller;
      this.callbackCtx_ = callbackCtx;
    }
    /**
     * Starts observing provided element.
     *
     * @param {Element} target - Element to be observed.
     * @returns {void}
     */


    ResizeObserverSPI.prototype.observe = function (target) {
      if (!arguments.length) {
        throw new TypeError('1 argument required, but only 0 present.');
      } // Do nothing if current environment doesn't have the Element interface.


      if (typeof Element === 'undefined' || !(Element instanceof Object)) {
        return;
      }

      if (!(target instanceof getWindowOf(target).Element)) {
        throw new TypeError('parameter 1 is not of type "Element".');
      }

      var observations = this.observations_; // Do nothing if element is already being observed.

      if (observations.has(target)) {
        return;
      }

      observations.set(target, new ResizeObservation(target));
      this.controller_.addObserver(this); // Force the update of observations.

      this.controller_.refresh();
    };
    /**
     * Stops observing provided element.
     *
     * @param {Element} target - Element to stop observing.
     * @returns {void}
     */


    ResizeObserverSPI.prototype.unobserve = function (target) {
      if (!arguments.length) {
        throw new TypeError('1 argument required, but only 0 present.');
      } // Do nothing if current environment doesn't have the Element interface.


      if (typeof Element === 'undefined' || !(Element instanceof Object)) {
        return;
      }

      if (!(target instanceof getWindowOf(target).Element)) {
        throw new TypeError('parameter 1 is not of type "Element".');
      }

      var observations = this.observations_; // Do nothing if element is not being observed.

      if (!observations.has(target)) {
        return;
      }

      observations.delete(target);

      if (!observations.size) {
        this.controller_.removeObserver(this);
      }
    };
    /**
     * Stops observing all elements.
     *
     * @returns {void}
     */


    ResizeObserverSPI.prototype.disconnect = function () {
      this.clearActive();
      this.observations_.clear();
      this.controller_.removeObserver(this);
    };
    /**
     * Collects observation instances the associated element of which has changed
     * it's content rectangle.
     *
     * @returns {void}
     */


    ResizeObserverSPI.prototype.gatherActive = function () {
      var _this = this;

      this.clearActive();
      this.observations_.forEach(function (observation) {
        if (observation.isActive()) {
          _this.activeObservations_.push(observation);
        }
      });
    };
    /**
     * Invokes initial callback function with a list of ResizeObserverEntry
     * instances collected from active resize observations.
     *
     * @returns {void}
     */


    ResizeObserverSPI.prototype.broadcastActive = function () {
      // Do nothing if observer doesn't have active observations.
      if (!this.hasActive()) {
        return;
      }

      var ctx = this.callbackCtx_; // Create ResizeObserverEntry instance for every active observation.

      var entries = this.activeObservations_.map(function (observation) {
        return new ResizeObserverEntry(observation.target, observation.broadcastRect());
      });
      this.callback_.call(ctx, entries, ctx);
      this.clearActive();
    };
    /**
     * Clears the collection of active observations.
     *
     * @returns {void}
     */


    ResizeObserverSPI.prototype.clearActive = function () {
      this.activeObservations_.splice(0);
    };
    /**
     * Tells whether observer has active observations.
     *
     * @returns {boolean}
     */


    ResizeObserverSPI.prototype.hasActive = function () {
      return this.activeObservations_.length > 0;
    };

    return ResizeObserverSPI;
  }(); // Registry of internal observers. If WeakMap is not available use current shim
  // for the Map collection as it has all required methods and because WeakMap
  // can't be fully polyfilled anyway.


  var observers = typeof WeakMap !== 'undefined' ? new WeakMap() : new MapShim();
  /**
   * ResizeObserver API. Encapsulates the ResizeObserver SPI implementation
   * exposing only those methods and properties that are defined in the spec.
   */

  var ResizeObserver =
  /** @class */
  function () {
    /**
     * Creates a new instance of ResizeObserver.
     *
     * @param {ResizeObserverCallback} callback - Callback that is invoked when
     *      dimensions of the observed elements change.
     */
    function ResizeObserver(callback) {
      if (!(this instanceof ResizeObserver)) {
        throw new TypeError('Cannot call a class as a function.');
      }

      if (!arguments.length) {
        throw new TypeError('1 argument required, but only 0 present.');
      }

      var controller = ResizeObserverController.getInstance();
      var observer = new ResizeObserverSPI(callback, controller, this);
      observers.set(this, observer);
    }

    return ResizeObserver;
  }(); // Expose public methods of ResizeObserver.


  ['observe', 'unobserve', 'disconnect'].forEach(function (method) {
    ResizeObserver.prototype[method] = function () {
      var _a;

      return (_a = observers.get(this))[method].apply(_a, arguments);
    };
  });

  var index = function () {
    // Export existing implementation if available.
    if (typeof global$1.ResizeObserver !== 'undefined') {
      return global$1.ResizeObserver;
    }

    return ResizeObserver;
  }();

  const isServer = typeof window === 'undefined';
  /* istanbul ignore next */

  const resizeHandler = function (entries) {
    for (const entry of entries) {
      const listeners = entry.target.__resizeListeners__ || [];

      if (listeners.length) {
        listeners.forEach(fn => {
          fn();
        });
      }
    }
  };

  const useResizeEvent = () => {
    let element = null;

    const addResizeListener = fn => {
      element.__resizeListeners__.push(fn);
    };

    const removeResizeListener = fn => {
      if (!element || !element.__resizeListeners__) return;

      element.__resizeListeners__.splice(element.__resizeListeners__.indexOf(fn), 1);

      if (!element.__resizeListeners__.length) {
        element.__ro__.disconnect();
      }
    };

    vue.onMounted(() => {
      element = vue.getCurrentInstance().vnode.el;
      if (isServer) return;

      if (!element.__resizeListeners__) {
        element.__resizeListeners__ = [];
        element.__ro__ = new index(resizeHandler);

        element.__ro__.observe(element);
      }
    });
    return {
      addResizeListener,
      removeResizeListener
    };
  };
  /* istanbul ignore next */

  const addResizeListener = function (element, fn) {
    if (isServer) return;

    if (!element.__resizeListeners__) {
      element.__resizeListeners__ = [];
      element.__ro__ = new index(resizeHandler);

      element.__ro__.observe(element);
    }

    element.__resizeListeners__.push(fn);
  };
  /* istanbul ignore next */

  const removeResizeListener = function (element, fn) {
    if (!element || !element.__resizeListeners__) return;

    element.__resizeListeners__.splice(element.__resizeListeners__.indexOf(fn), 1);

    if (!element.__resizeListeners__.length) {
      element.__ro__.disconnect();
    }
  };

  const BAR_MAP = {
    vertical: {
      offset: 'offsetHeight',
      scroll: 'scrollTop',
      scrollSize: 'scrollHeight',
      size: 'height',
      key: 'vertical',
      axis: 'Y',
      client: 'clientY',
      direction: 'top'
    },
    horizontal: {
      offset: 'offsetWidth',
      scroll: 'scrollLeft',
      scrollSize: 'scrollWidth',
      size: 'width',
      key: 'horizontal',
      axis: 'X',
      client: 'clientX',
      direction: 'left'
    }
  };
  function renderThumbStyle({
    move,
    size,
    bar
  }) {
    const style = {};
    const translate = `translate${bar.value.axis}(${move.value}%)`;
    style[bar.value.size] = size.value;
    style.transform = translate;
    style.msTransform = translate;
    style.webkitTransform = translate;
    return style;
  }

  const useDrag$1 = ({
    bar,
    state,
    thumb,
    cursorDown
  }) => {
    const instance = vue.getCurrentInstance();
    const {
      proxy
    } = instance;
    const wrap = vue.computed(() => instance.parent.proxy.wrap);

    const startDrag = e => {
      e.stopImmediatePropagation();
      cursorDown.value = true;
      on(document, 'mousemove', mouseMoveDocumentHandler);
      on(document, 'mouseup', mouseUpDocumentHandler);

      document.onselectstart = () => false;
    };

    const mouseMoveDocumentHandler = e => {
      if (cursorDown.value === false) return;
      const prevPage = state[bar.value.axis];
      if (!prevPage) return;
      const offset = (proxy.$el.getBoundingClientRect()[bar.value.direction] - e[bar.value.client]) * -1;
      const thumbClickPosition = thumb.value[bar.value.offset] - prevPage;
      const thumbPositionPercentage = (offset - thumbClickPosition) * 100 / proxy.$el[bar.value.offset];
      wrap.value[bar.value.scroll] = thumbPositionPercentage * wrap.value[bar.value.scrollSize] / 100;
    };

    const mouseUpDocumentHandler = () => {
      cursorDown.value = false;
      state[bar.value.axis] = 0;
      off(document, 'mousemove', mouseMoveDocumentHandler);
      document.onselectstart = null;
    };

    const clickThumbHandler = e => {
      // prevent click event of right button
      if (e.ctrlKey || e.button === 2) {
        return;
      }

      startDrag(e);
      state[bar.value.axis] = e.currentTarget[bar.value.offset] - (e[bar.value.client] - e.currentTarget.getBoundingClientRect()[bar.value.direction]);
    };

    const clickTrackHandler = e => {
      const offset = Math.abs(e.target.getBoundingClientRect()[bar.value.direction] - e[bar.value.client]);
      const thumbHalf = thumb.value[bar.value.offset] / 2;
      const thumbPositionPercentage = (offset - thumbHalf) * 100 / proxy.$el[bar.value.offset];
      wrap.value[bar.value.scroll] = thumbPositionPercentage * wrap.value[bar.value.scrollSize] / 100;
    };

    vue.onUnmounted(() => {
      off(document, 'mouseup', mouseUpDocumentHandler);
    });
    return {
      clickThumbHandler,
      clickTrackHandler
    };
  };
  /* istanbul ignore next */


  var Bar = {
    name: 'Bar',
    props: {
      vertical: Boolean,
      size: String,
      move: Number
    },

    setup(props) {
      const {
        size,
        move,
        vertical
      } = vue.toRefs(props);
      const bar = vue.computed(() => BAR_MAP[vertical.value ? 'vertical' : 'horizontal']);
      const state = vue.reactive({});
      const cursorDown = vue.ref(false);
      const thumb = vue.ref(null);
      const {
        clickThumbHandler,
        clickTrackHandler
      } = useDrag$1({
        bar,
        state,
        thumb,
        cursorDown
      });
      return () => vue.createVNode("div", {
        "class": ['el-scrollbar__bar', 'is-' + bar.value.key],
        "onMouseDown": clickTrackHandler
      }, [vue.createVNode("div", {
        "ref": thumb,
        "className": "el-scrollbar__thumb",
        "onMouseDown": clickThumbHandler,
        "style": renderThumbStyle({
          size,
          move,
          bar
        })
      }, null)]);
    }

  };

  function _isSlot$2(s) {
    return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !vue.isVNode(s);
  }

  const useScroll = (wrap, native, resize, noresize) => {
    const data = vue.reactive({
      sizeWidth: '0',
      sizeHeight: '0',
      moveX: 0,
      moveY: 0
    });

    const handleScroll = () => {
      data.moveY = wrap.value.scrollTop * 100 / wrap.value.clientHeight;
      data.moveX = wrap.value.scrollLeft * 100 / wrap.value.clientWidth;
    };

    const update = () => {
      if (!(wrap !== null && wrap !== void 0 && wrap.value)) return;
      const heightPercentage = wrap.value.clientHeight * 100 / wrap.value.scrollHeight;
      const widthPercentage = wrap.value.clientWidth * 100 / wrap.value.scrollWidth;
      data.sizeHeight = heightPercentage < 100 ? heightPercentage + '%' : '';
      data.sizeWidth = widthPercentage < 100 ? widthPercentage + '%' : '';
    };

    vue.onMounted(() => {
      if (native.value) return;
      vue.nextTick(update);
      !noresize.value && addResizeListener(resize.value, update);
    });
    vue.onUnmounted(() => {
      if (native.value) return;
      !noresize.value && removeResizeListener(resize.value, update);
    });
    return {
      data,
      update,
      handleScroll
    };
  };
  /* istanbul ignore next */


  var ElScrollbar = {
    name: 'ElScrollbar',
    components: {
      Bar
    },
    props: {
      native: Boolean,
      wrapStyle: {},
      wrapClass: {},
      viewClass: {},
      viewStyle: {},
      noresize: Boolean,
      // 如果 container 尺寸不会发生变化，最好设置它可以优化性能
      tag: {
        type: String,
        default: 'div'
      }
    },

    setup(props) {
      const wrap = vue.ref(null);
      const resize = vue.ref(null);
      const {
        wrapStyle,
        tag,
        native,
        noresize
      } = vue.toRefs(props);
      const gutter = getScrollBarWidth();
      let style = wrapStyle === null || wrapStyle === void 0 ? void 0 : wrapStyle.value;
      const ComponentName = tag.value;

      if (gutter) {
        const gutterWith = `-${gutter}px`;
        const gutterStyle = `margin-bottom: ${gutterWith}; margin-right: ${gutterWith};`;

        if (Array.isArray(wrapStyle === null || wrapStyle === void 0 ? void 0 : wrapStyle.value)) {
          style = toObject(wrapStyle === null || wrapStyle === void 0 ? void 0 : wrapStyle.value);
          style.marginRight = style.marginBottom = gutterWith;
        } else if (typeof wrapStyle === 'string') {
          style += gutterStyle;
        } else {
          style = gutterStyle;
        }
      }

      const {
        data,
        handleScroll,
        update
      } = useScroll(wrap, native, resize, noresize);
      return {
        // state
        data,
        style,
        native,
        gutter,
        wrap,
        resize,
        ComponentName,
        // methods
        handleScroll,
        update
      };
    },

    render() {
      let _slot;

      const ComponentName = this.ComponentName;
      return vue.createVNode("div", {
        "class": "el-scrollbar"
      }, [vue.createVNode("div", {
        "ref": "wrap",
        "class": [this.wrapClass, 'el-scrollbar__wrap', {
          'el-scrollbar__wrap--hidden-default': !this.native && !this.gutter
        }],
        "onScroll": () => {
          !this.native && this.handleScroll();
        },
        "style": this.style
      }, [vue.createVNode(ComponentName, {
        "ref": "resize",
        "class": ['el-scrollbar__view', this.viewClass],
        "style": this.viewStyle
      }, _isSlot$2(_slot = this.$slots.default()) ? _slot : {
        default: () => [_slot]
      })]), !this.native.value && [vue.createVNode(Bar, {
        "move": this.data.moveX,
        "size": this.data.sizeWidth
      }, null), vue.createVNode(Bar, {
        "vertical": true,
        "move": this.data.moveY,
        "size": this.data.sizeHeight
      }, null)]]);
    }

  };

  /* istanbul ignore next */

  ElScrollbar.install = function (app) {
    app.component(ElScrollbar.name, ElScrollbar);
  };

  /* eslint-disable no-undefined,no-param-reassign,no-shadow */

  /**
   * Throttle execution of a function. Especially useful for rate limiting
   * execution of handlers on events like resize and scroll.
   *
   * @param  {number}    delay -          A zero-or-greater delay in milliseconds. For event callbacks, values around 100 or 250 (or even higher) are most useful.
   * @param  {boolean}   [noTrailing] -   Optional, defaults to false. If noTrailing is true, callback will only execute every `delay` milliseconds while the
   *                                    throttled-function is being called. If noTrailing is false or unspecified, callback will be executed one final time
   *                                    after the last throttled-function call. (After the throttled-function has not been called for `delay` milliseconds,
   *                                    the internal counter is reset).
   * @param  {Function}  callback -       A function to be executed after delay milliseconds. The `this` context and all arguments are passed through, as-is,
   *                                    to `callback` when the throttled-function is executed.
   * @param  {boolean}   [debounceMode] - If `debounceMode` is true (at begin), schedule `clear` to execute after `delay` ms. If `debounceMode` is false (at end),
   *                                    schedule `callback` to execute after `delay` ms.
   *
   * @returns {Function}  A new, throttled, function.
   */
  function throttle$1(delay, noTrailing, callback, debounceMode) {
    /*
     * After wrapper has stopped being called, this timeout ensures that
     * `callback` is executed at the proper times in `throttle` and `end`
     * debounce modes.
     */
    var timeoutID;
    var cancelled = false; // Keep track of the last time `callback` was executed.

    var lastExec = 0; // Function to clear existing timeout

    function clearExistingTimeout() {
      if (timeoutID) {
        clearTimeout(timeoutID);
      }
    } // Function to cancel next exec


    function cancel() {
      clearExistingTimeout();
      cancelled = true;
    } // `noTrailing` defaults to falsy.


    if (typeof noTrailing !== 'boolean') {
      debounceMode = callback;
      callback = noTrailing;
      noTrailing = undefined;
    }
    /*
     * The `wrapper` function encapsulates all of the throttling / debouncing
     * functionality and when executed will limit the rate at which `callback`
     * is executed.
     */


    function wrapper() {
      for (var _len = arguments.length, arguments_ = new Array(_len), _key = 0; _key < _len; _key++) {
        arguments_[_key] = arguments[_key];
      }

      var self = this;
      var elapsed = Date.now() - lastExec;

      if (cancelled) {
        return;
      } // Execute `callback` and update the `lastExec` timestamp.


      function exec() {
        lastExec = Date.now();
        callback.apply(self, arguments_);
      }
      /*
       * If `debounceMode` is true (at begin) this is used to clear the flag
       * to allow future `callback` executions.
       */


      function clear() {
        timeoutID = undefined;
      }

      if (debounceMode && !timeoutID) {
        /*
         * Since `wrapper` is being called for the first time and
         * `debounceMode` is true (at begin), execute `callback`.
         */
        exec();
      }

      clearExistingTimeout();

      if (debounceMode === undefined && elapsed > delay) {
        /*
         * In throttle mode, if `delay` time has been exceeded, execute
         * `callback`.
         */
        exec();
      } else if (noTrailing !== true) {
        /*
         * In trailing throttle mode, since `delay` time has not been
         * exceeded, schedule `callback` to execute `delay` ms after most
         * recent execution.
         *
         * If `debounceMode` is true (at begin), schedule `clear` to execute
         * after `delay` ms.
         *
         * If `debounceMode` is false (at end), schedule `callback` to
         * execute after `delay` ms.
         */
        timeoutID = setTimeout(debounceMode ? clear : exec, debounceMode === undefined ? delay - elapsed : delay);
      }
    }

    wrapper.cancel = cancel; // Return the wrapper function.

    return wrapper;
  }
  /* eslint-disable no-undefined */

  /**
   * Debounce execution of a function. Debouncing, unlike throttling,
   * guarantees that a function is only executed a single time, either at the
   * very beginning of a series of calls, or at the very end.
   *
   * @param  {number}   delay -         A zero-or-greater delay in milliseconds. For event callbacks, values around 100 or 250 (or even higher) are most useful.
   * @param  {boolean}  [atBegin] -     Optional, defaults to false. If atBegin is false or unspecified, callback will only be executed `delay` milliseconds
   *                                  after the last debounced-function call. If atBegin is true, callback will be executed only at the first debounced-function call.
   *                                  (After the throttled-function has not been called for `delay` milliseconds, the internal counter is reset).
   * @param  {Function} callback -      A function to be executed after delay milliseconds. The `this` context and all arguments are passed through, as-is,
   *                                  to `callback` when the debounced-function is executed.
   *
   * @returns {Function} A new, debounced function.
   */


  function debounce$1(delay, atBegin, callback) {
    return callback === undefined ? throttle$1(delay, atBegin, false) : throttle$1(delay, callback, atBegin !== false);
  }

  const nodeList = [];
  const ctx = '@@clickoutsideContext';
  let startClick;
  let seed = 0; // !Vue.prototype.$isServer && on(document, 'mousedown', e => (startClick = e))

  on(document, 'mousedown', e => startClick = e);
  on(document, 'mouseup', e => {
    // !Vue.prototype.$isServer && on(document, 'mouseup', e => {
    nodeList.forEach(node => node[ctx].documentHandler(e, startClick));
  });

  function createDocumentHandler(el, binding, vnode) {
    return function (mouseup = {}, mousedown = {}) {
      if (!vnode || !binding.instance || !mouseup.target || !mousedown.target || el.contains(mouseup.target) || el.contains(mousedown.target) || el === mouseup.target || binding.instance.popperElm && (binding.instance.popperElm.contains(mouseup.target) || binding.instance.popperElm.contains(mousedown.target))) return;

      if (binding.expression && el[ctx].methodName && binding.instance[el[ctx].methodName]) {
        binding.instance[el[ctx].methodName]();
      } else {
        el[ctx].bindingFn && el[ctx].bindingFn();
      }
    };
  }
  /**
   * v-clickoutside
   * @desc 点击元素外面才会触发的事件
   * @example
   * ```vue
   * <div v-element-clickoutside="handleClose">
   * ```
   */


  var Clickoutside = {
    beforeMount(el, binding, vnode) {
      nodeList.push(el);
      const id = seed++;
      el[ctx] = {
        id,
        documentHandler: createDocumentHandler(el, binding, vnode),
        methodName: binding.expression,
        bindingFn: binding.value
      };
    },

    updated(el, binding, vnode) {
      el[ctx].documentHandler = createDocumentHandler(el, binding, vnode);
      el[ctx].methodName = binding.expression;
      el[ctx].bindingFn = binding.value;
    },

    unmounted(el) {
      const len = nodeList.length;

      for (let i = 0; i < len; i++) {
        if (nodeList[i][ctx].id === el[ctx].id) {
          nodeList.splice(i, 1);
          break;
        }
      }

      delete el[ctx];
    }

  };

  function scrollIntoView(container, selected) {
    // if (Vue.prototype.$isServer) return
    if (!selected) {
      container.scrollTop = 0;
      return;
    }

    const offsetParents = [];
    let pointer = selected.offsetParent;

    while (pointer && container !== pointer && container.contains(pointer)) {
      offsetParents.push(pointer);
      pointer = pointer.offsetParent;
    }

    const top = selected.offsetTop + offsetParents.reduce((prev, curr) => prev + curr.offsetTop, 0);
    const bottom = top + selected.offsetHeight;
    const viewRectTop = container.scrollTop;
    const viewRectBottom = viewRectTop + container.clientHeight;

    if (top < viewRectTop) {
      container.scrollTop = top;
    } else if (bottom > viewRectBottom) {
      container.scrollTop = bottom - container.clientHeight;
    }
  }

  var NavigationMixin = {
    data() {
      return {
        hoverOption: -1
      };
    },

    computed: {
      optionsAllDisabled() {
        return this.options.filter(option => option.visible).every(option => option.disabled);
      }

    },
    watch: {
      hoverIndex(val) {
        if (typeof val === 'number' && val > -1) {
          this.hoverOption = this.options[val] || {};
        }

        this.options.forEach(option => {
          option.hover = this.hoverOption === option;
        });
      }

    },
    methods: {
      navigateOptions(direction) {
        if (!this.visible) {
          this.visible = true;
          return;
        }

        if (this.options.length === 0 || this.filteredOptionsCount === 0) return;

        if (!this.optionsAllDisabled) {
          if (direction === 'next') {
            this.hoverIndex++;

            if (this.hoverIndex === this.options.length) {
              this.hoverIndex = 0;
            }
          } else if (direction === 'prev') {
            this.hoverIndex--;

            if (this.hoverIndex < 0) {
              this.hoverIndex = this.options.length - 1;
            }
          }

          const option = this.options[this.hoverIndex];

          if (option.disabled === true || option.groupDisabled === true || !option.visible) {
            this.navigateOptions(direction);
          }

          this.$nextTick(() => this.scrollToOption(this.hoverOption));
        }
      }

    }
  };

  function isDef(val) {
    return val !== undefined && val !== null;
  }
  function isKorean(text) {
    const reg = /([(\uAC00-\uD7AF)|(\u3130-\u318F)])+/gi;
    return reg.test(text);
  }

  var script$1g = {
    mixins: [Locale, Focus('reference'), NavigationMixin],
    name: 'ElSelect',
    componentName: 'ElSelect',
    inject: {
      elForm: {
        default: ''
      },
      elFormItem: {
        default: ''
      }
    },

    provide() {
      return {
        select: this
      };
    },

    computed: {
      _elFormItemSize() {
        return (this.elFormItem || {}).elFormItemSize;
      },

      readonly() {
        return !this.filterable || this.multiple || !isIE() && !isEdge() && !this.visible;
      },

      showClose() {
        const hasValue = this.multiple ? Array.isArray(this.modelValue) && this.modelValue.length > 0 : this.modelValue !== undefined && this.modelValue !== null && this.modelValue !== '';
        const criteria = this.clearable && !this.selectDisabled && this.inputHovering && hasValue;
        return criteria;
      },

      iconClass() {
        return this.remote && this.filterable ? '' : this.visible ? 'arrow-up is-reverse' : 'arrow-up';
      },

      debounce() {
        return this.remote ? 300 : 0;
      },

      emptyText() {
        if (this.loading) {
          return this.loadingText || this.t('el.select.loading');
        } else {
          if (this.remote && this.query === '' && this.options.length === 0) return false;

          if (this.filterable && this.query && this.options.length > 0 && this.filteredOptionsCount === 0) {
            return this.noMatchText || this.t('el.select.noMatch');
          }

          if (this.options.length === 0) {
            return this.noDataText || this.t('el.select.noData');
          }
        }

        return null;
      },

      showNewOption() {
        const hasExistingOption = this.options.filter(option => !option.created).some(option => option.currentLabel === this.query);
        return this.filterable && this.allowCreate && this.query !== '' && !hasExistingOption;
      },

      selectSize() {
        return this.size || this._elFormItemSize || (this.$ELEMENT || {}).size;
      },

      selectDisabled() {
        return this.disabled || (this.elForm || {}).disabled;
      },

      collapseTagSize() {
        return ['small', 'mini'].indexOf(this.selectSize) > -1 ? 'mini' : 'small';
      }

    },
    components: {
      ElInput: script$1l,
      ElSelectMenu: script$1j,
      ElOption: script$1i,
      ElTag: script$1h,
      ElScrollbar
    },
    directives: {
      Clickoutside
    },
    props: {
      name: String,
      id: String,
      modelValue: {
        required: true
      },
      autocomplete: {
        type: String,
        default: 'off'
      },

      /** @Deprecated in next major version */
      autoComplete: {
        type: String,

        validator() {
          console.warn("[Element Warn][Select]'auto-complete' property will be deprecated in next major version. please use 'autocomplete' instead.");
          return true;
        }

      },
      automaticDropdown: Boolean,
      size: String,
      disabled: Boolean,
      clearable: Boolean,
      filterable: Boolean,
      allowCreate: Boolean,
      loading: Boolean,
      popperClass: String,
      remote: Boolean,
      loadingText: String,
      noMatchText: String,
      noDataText: String,
      remoteMethod: Function,
      filterMethod: Function,
      multiple: Boolean,
      multipleLimit: {
        type: Number,
        default: 0
      },
      placeholder: {
        type: String,

        default() {
          return t('el.select.placeholder');
        }

      },
      defaultFirstOption: Boolean,
      reserveKeyword: Boolean,
      valueKey: {
        type: String,
        default: 'value'
      },
      collapseTags: Boolean,
      popperAppendToBody: {
        type: Boolean,
        default: true
      }
    },
    emits: ['update:modelValue', 'input', 'change', 'blur', 'focus', 'clear', 'visible-change', 'remove-tag', 'setSelected'],

    setup() {
      const {
        dispatch,
        broadcast,
        on
      } = useEmitter();
      return {
        dispatch,
        broadcast,
        on
      };
    },

    data() {
      return {
        options: [],
        cachedOptions: [],
        createdLabel: null,
        createdSelected: false,
        selected: this.multiple ? [] : {},
        inputLength: 20,
        inputWidth: 0,
        initialInputHeight: 0,
        cachedPlaceHolder: '',
        optionsCount: 0,
        filteredOptionsCount: 0,
        visible: false,
        softFocus: false,
        selectedLabel: '',
        hoverIndex: -1,
        query: '',
        previousQuery: null,
        inputHovering: false,
        currentPlaceholder: '',
        menuVisibleOnFocus: false,
        isOnComposition: false,
        isSilentBlur: false
      };
    },

    watch: {
      selectDisabled() {
        this.$nextTick(() => {
          this.resetInputHeight();
        });
      },

      placeholder(val) {
        this.cachedPlaceHolder = this.currentPlaceholder = val;
      },

      modelValue(val, oldVal) {
        if (this.multiple) {
          this.resetInputHeight();

          if (val && val.length > 0 || this.$refs.input && this.query !== '') {
            this.currentPlaceholder = '';
          } else {
            this.currentPlaceholder = this.cachedPlaceHolder;
          }

          if (this.filterable && !this.reserveKeyword) {
            this.query = '';
            this.handleQueryChange(this.query);
          }
        }

        this.setSelected();

        if (this.filterable && !this.multiple) {
          this.inputLength = 20;
        }

        if (!valueEquals(val, oldVal)) {
          this.dispatch('el.form.change', val);
        }
      },

      visible(val) {
        if (!val) {
          this.broadcast('destroyPopper');

          if (this.$refs.input) {
            this.$refs.input.blur();
          }

          this.query = '';
          this.previousQuery = null;
          this.selectedLabel = '';
          this.inputLength = 20;
          this.menuVisibleOnFocus = false;
          this.resetHoverIndex();
          this.$nextTick(() => {
            if (this.$refs.input && this.$refs.input.value === '' && this.selected.length === 0) {
              this.currentPlaceholder = this.cachedPlaceHolder;
            }
          });

          if (!this.multiple) {
            if (this.selected) {
              if (this.filterable && this.allowCreate && this.createdSelected && this.createdLabel) {
                this.selectedLabel = this.createdLabel;
              } else {
                this.selectedLabel = this.selected.currentLabel;
              }

              if (this.filterable) this.query = this.selectedLabel;
            }

            if (this.filterable) {
              this.currentPlaceholder = this.cachedPlaceHolder;
            }
          }
        } else {
          this.broadcast('updatePopper');

          if (this.filterable) {
            this.query = this.remote ? '' : this.selectedLabel;
            this.handleQueryChange(this.query);

            if (this.multiple) {
              this.$refs.input.focus();
            } else {
              if (!this.remote) {
                this.broadcast('queryChange', '');
                this.broadcast('optionGroup.queryChange');
              }

              if (this.selectedLabel) {
                this.currentPlaceholder = this.selectedLabel;
                this.selectedLabel = '';
              }
            }
          }
        }

        this.$emit('visible-change', val);
      },

      options() {
        if (this.$isServer) return;
        this.$nextTick(() => {
          this.broadcast('updatePopper');
        });

        if (this.multiple) {
          this.resetInputHeight();
        }

        const inputs = this.$el.querySelectorAll('input');

        if ([].indexOf.call(inputs, document.activeElement) === -1) {
          this.setSelected();
        }

        if (this.defaultFirstOption && (this.filterable || this.remote) && this.filteredOptionsCount) {
          this.checkDefaultFirstOption();
        }
      }

    },
    methods: {
      handleComposition(event) {
        const text = event.target.value;

        if (event.type === 'compositionend') {
          this.isOnComposition = false;
          this.$nextTick(() => this.handleQueryChange(text));
        } else {
          const lastCharacter = text[text.length - 1] || '';
          this.isOnComposition = !isKorean(lastCharacter);
        }
      },

      handleQueryChange(val) {
        if (this.previousQuery === val || this.isOnComposition) return;

        if (this.previousQuery === null && (typeof this.filterMethod === 'function' || typeof this.remoteMethod === 'function')) {
          this.previousQuery = val;
          return;
        }

        this.previousQuery = val;
        this.$nextTick(() => {
          if (this.visible) {
            this.broadcast('updatePopper');
          }
        });
        this.hoverIndex = -1;

        if (this.multiple && this.filterable) {
          this.$nextTick(() => {
            const length = this.$refs.input.value.length * 15 + 20;
            this.inputLength = this.collapseTags ? Math.min(50, length) : length;
            this.managePlaceholder();
            this.resetInputHeight();
          });
        }

        if (this.remote && typeof this.remoteMethod === 'function') {
          this.hoverIndex = -1;
          this.remoteMethod(val);
        } else if (typeof this.filterMethod === 'function') {
          this.filterMethod(val);
          this.broadcast('optionGroup.queryChange');
        } else {
          this.filteredOptionsCount = this.optionsCount;
          this.broadcast('queryChange', val);
          this.broadcast('optionGroup.queryChange');
        }

        if (this.defaultFirstOption && (this.filterable || this.remote) && this.filteredOptionsCount) {
          this.checkDefaultFirstOption();
        }
      },

      scrollToOption(option) {
        const target = Array.isArray(option) && option[0] ? option[0].$el : option.$el;

        if (this.$refs.popper && target) {
          const menu = this.$refs.popper.$el.querySelector('.el-select-dropdown__wrap');
          scrollIntoView(menu, target);
        }

        this.$refs.scrollbar && this.$refs.scrollbar.handleScroll();
      },

      handleMenuEnter() {
        this.$nextTick(() => this.scrollToOption(this.selected));
      },

      emitChange(val) {
        if (!valueEquals(this.modelValue, val)) {
          this.$emit('change', val);
        }
      },

      getOption(value) {
        let option;
        const isObject = Object.prototype.toString.call(value).toLowerCase() === '[object object]';
        const isNull = Object.prototype.toString.call(value).toLowerCase() === '[object null]';
        const isUndefined = Object.prototype.toString.call(value).toLowerCase() === '[object undefined]';

        for (let i = this.cachedOptions.length - 1; i >= 0; i--) {
          const cachedOption = this.cachedOptions[i];
          const isEqual = isObject ? getValueByPath(cachedOption.value, this.valueKey) === getValueByPath(value, this.valueKey) : cachedOption.value === value;

          if (isEqual) {
            option = cachedOption;
            break;
          }
        }

        if (option) return option;
        const label = !isObject && !isNull && !isUndefined ? value : '';
        const newOption = {
          value: value,
          currentLabel: label
        };

        if (this.multiple) {
          newOption.hitState = false;
        }

        return newOption;
      },

      setSelected() {
        if (!this.multiple) {
          const option = this.getOption(this.modelValue);

          if (option.created) {
            this.createdLabel = option.currentLabel;
            this.createdSelected = true;
          } else {
            this.createdSelected = false;
          }

          this.selectedLabel = option.currentLabel;
          this.selected = option;
          if (this.filterable) this.query = this.selectedLabel;
          return;
        }

        const result = [];

        if (Array.isArray(this.modelValue)) {
          this.modelValue.forEach(value => {
            result.push(this.getOption(value));
          });
        }

        this.selected = result;
        this.$nextTick(() => {
          this.resetInputHeight();
        });
      },

      handleFocus(event) {
        if (!this.softFocus) {
          if (this.automaticDropdown || this.filterable) {
            this.visible = true;

            if (this.filterable) {
              this.menuVisibleOnFocus = true;
            }
          }

          this.$emit('focus', event);
        } else {
          this.softFocus = false;
        }
      },

      blur() {
        this.visible = false;
        this.$refs.reference.blur();
      },

      handleBlur(event) {
        setTimeout(() => {
          if (this.isSilentBlur) {
            this.isSilentBlur = false;
          } else {
            this.$emit('blur', event);
          }
        }, 50);
        this.softFocus = false;
      },

      handleClearClick(event) {
        this.deleteSelected(event);
      },

      doDestroy() {
        this.$refs.popper && this.$refs.popper.doDestroy();
      },

      handleClose() {
        this.visible = false;
      },

      toggleLastOptionHitState(hit) {
        if (!Array.isArray(this.selected)) return;
        const option = this.selected[this.selected.length - 1];
        if (!option) return;

        if (hit === true || hit === false) {
          option.hitState = hit;
          return hit;
        }

        option.hitState = !option.hitState;
        return option.hitState;
      },

      deletePrevTag(e) {
        if (e.target.value.length <= 0 && !this.toggleLastOptionHitState()) {
          const value = this.modelValue.slice();
          value.pop();
          this.$emit('update:modelValue', value);
          this.emitChange(value);
        }
      },

      managePlaceholder() {
        if (this.currentPlaceholder !== '') {
          this.currentPlaceholder = this.$refs.input.value ? '' : this.cachedPlaceHolder;
        }
      },

      resetInputState(e) {
        if (e.keyCode !== 8) this.toggleLastOptionHitState(false);
        this.inputLength = this.$refs.input.value.length * 15 + 20;
        this.resetInputHeight();
      },

      resetInputHeight() {
        if (this.collapseTags && !this.filterable) return;
        this.$nextTick(() => {
          if (!this.$refs.reference) return;
          const inputChildNodes = this.$refs.reference.$el.childNodes;
          const input = [].filter.call(inputChildNodes, item => item.tagName === 'INPUT')[0];
          const tags = this.$refs.tags;
          const sizeInMap = this.initialInputHeight || 40;

          if (input) {
            input.style.height = this.selected.length === 0 ? sizeInMap + 'px' : Math.max(tags ? tags.clientHeight + (tags.clientHeight > sizeInMap ? 6 : 0) : 0, sizeInMap) + 'px';
          }

          if (this.visible && this.emptyText !== false) {
            this.broadcast('updatePopper');
          }
        });
      },

      resetHoverIndex() {
        setTimeout(() => {
          if (!this.multiple) {
            this.hoverIndex = this.options.indexOf(this.selected);
          } else {
            if (this.selected.length > 0) {
              this.hoverIndex = Math.min.apply(null, this.selected.map(item => this.options.indexOf(item)));
            } else {
              this.hoverIndex = -1;
            }
          }
        }, 300);
      },

      handleOptionSelect({
        option,
        byClick
      }) {
        if (this.multiple) {
          const value = (this.modelValue || []).slice();
          const optionIndex = this.getValueIndex(value, option.value);

          if (optionIndex > -1) {
            value.splice(optionIndex, 1);
          } else if (this.multipleLimit <= 0 || value.length < this.multipleLimit) {
            value.push(option.value);
          }

          this.$emit('update:modelValue', value);
          this.emitChange(value);

          if (option.created) {
            this.query = '';
            this.handleQueryChange('');
            this.inputLength = 20;
          }

          if (this.filterable) this.$refs.input.focus();
        } else {
          this.$emit('update:modelValue', option.value);
          this.emitChange(option.value);
          this.visible = false;
        }

        this.isSilentBlur = byClick;
        this.setSoftFocus();
        if (this.visible) return;
        this.$nextTick(() => {
          this.scrollToOption(option);
        });
      },

      setSoftFocus() {
        this.softFocus = true;
        const input = this.$refs.input || this.$refs.reference;

        if (input) {
          input.focus();
        }
      },

      getValueIndex(arr = [], value) {
        const isObject = Object.prototype.toString.call(value).toLowerCase() === '[object object]';

        if (!isObject) {
          return arr.indexOf(value);
        } else {
          const valueKey = this.valueKey;
          let index = -1;
          arr.some((item, i) => {
            if (getValueByPath(item, valueKey) === getValueByPath(value, valueKey)) {
              index = i;
              return true;
            }

            return false;
          });
          return index;
        }
      },

      toggleMenu() {
        if (!this.selectDisabled) {
          if (this.menuVisibleOnFocus) {
            this.menuVisibleOnFocus = false;
          } else {
            this.visible = !this.visible;
          }

          if (this.visible) {
            (this.$refs.input || this.$refs.reference).focus();
          }
        }
      },

      selectOption() {
        if (!this.visible) {
          this.toggleMenu();
        } else {
          if (this.options[this.hoverIndex]) {
            this.handleOptionSelect({
              option: this.options[this.hoverIndex]
            });
          }
        }
      },

      deleteSelected(event) {
        event.stopPropagation();
        const value = this.multiple ? [] : '';
        this.$emit('update:modelValue', value);
        this.emitChange(value);
        this.visible = false;
        this.$emit('clear');
      },

      deleteTag(event, tag) {
        const index = this.selected.indexOf(tag);

        if (index > -1 && !this.selectDisabled) {
          const value = this.modelValue.slice();
          value.splice(index, 1); // this.$emit('input', value)

          this.$emit('update:modelValue', value);
          this.emitChange(value);
          this.$emit('remove-tag', tag.value);
        }

        event.stopPropagation();
      },

      onInputChange() {
        if (this.filterable && this.query !== this.selectedLabel) {
          this.query = this.selectedLabel;
          this.handleQueryChange(this.query);
        }
      },

      onOptionDestroy(index) {
        if (index > -1) {
          this.optionsCount--;
          this.filteredOptionsCount--;
          this.options.splice(index, 1);
        }
      },

      resetInputWidth() {
        this.inputWidth = this.$refs.reference.$el.getBoundingClientRect().width;
      },

      handleResize() {
        this.resetInputWidth();
        if (this.multiple) this.resetInputHeight();
      },

      checkDefaultFirstOption() {
        this.hoverIndex = -1; // highlight the created option

        let hasCreated = false;

        for (let i = this.options.length - 1; i >= 0; i--) {
          if (this.options[i].created) {
            hasCreated = true;
            this.hoverIndex = i;
            break;
          }
        }

        if (hasCreated) return;

        for (let i = 0; i !== this.options.length; ++i) {
          const option = this.options[i];

          if (this.query) {
            // highlight first options that passes the filter
            if (!option.disabled && !option.groupDisabled && option.visible) {
              this.hoverIndex = i;
              break;
            }
          } else {
            // highlight currently selected option
            if (option.itemSelected) {
              this.hoverIndex = i;
              break;
            }
          }
        }
      },

      getValueKey(item) {
        if (Object.prototype.toString.call(item.value).toLowerCase() !== '[object object]') {
          return item.value;
        } else {
          return getValueByPath(item.value, this.valueKey);
        }
      }

    },

    created() {
      this.cachedPlaceHolder = this.currentPlaceholder = this.placeholder;

      if (this.multiple && !Array.isArray(this.modelValue)) {
        // this.$emit('input', [])
        this.$emit('update:modelValue', []);
      }

      if (!this.multiple && Array.isArray(this.modelValue)) {
        // this.$emit('input', '')
        this.$emit('update:modelValue', '');
      }

      this.debouncedOnInputChange = debounce$1(this.debounce, () => {
        this.onInputChange();
      });
      this.debouncedQueryChange = debounce$1(this.debounce, e => {
        this.handleQueryChange(e.target.value);
      });
      this.on('handleOptionClick', this.handleOptionSelect);
      this.on('setSelected', this.setSelected);
    },

    mounted() {
      if (this.multiple && Array.isArray(this.modelValue) && this.modelValue.length > 0) {
        this.currentPlaceholder = '';
      }

      addResizeListener(this.$el, this.handleResize);
      const reference = this.$refs.reference;

      if (reference && reference.$el) {
        const sizeMap = {
          medium: 36,
          small: 32,
          mini: 28
        };
        const input = reference.$el.querySelector('input');
        this.initialInputHeight = input.getBoundingClientRect().height || sizeMap[this.selectSize];
      }

      if (this.remote && this.multiple) {
        this.resetInputHeight();
      }

      this.$nextTick(() => {
        if (reference && reference.$el) {
          this.inputWidth = reference.$el.getBoundingClientRect().width;
        }
      });
      this.setSelected();
    },

    beforeUnmount() {
      if (this.$el && this.handleResize) removeResizeListener(this.$el, this.handleResize);
    }

  };

  const _hoisted_1$P = {
    key: 0
  };
  const _hoisted_2$y = {
    class: "el-select__tags-text"
  };
  const _hoisted_3$r = {
    class: "el-select__tags-text"
  };
  const _hoisted_4$g = {
    class: "el-select__tags-text"
  };
  const _hoisted_5$c = {
    key: 1,
    class: "el-select-dropdown__empty"
  };
  function render$17(_ctx, _cache, $props, $setup, $data, $options) {
    const _component_el_tag = vue.resolveComponent("el-tag");

    const _component_el_input = vue.resolveComponent("el-input");

    const _component_el_option = vue.resolveComponent("el-option");

    const _component_el_scrollbar = vue.resolveComponent("el-scrollbar");

    const _component_el_select_menu = vue.resolveComponent("el-select-menu");

    const _directive_clickoutside = vue.resolveDirective("clickoutside");

    return vue.withDirectives((vue.openBlock(), vue.createBlock("div", {
      class: ["el-select", [$options.selectSize ? 'el-select--' + $options.selectSize : '']],
      onClick: _cache[23] || (_cache[23] = vue.withModifiers((...args) => $options.toggleMenu && $options.toggleMenu(...args), ["stop"])),
      onMouseenter: _cache[24] || (_cache[24] = $event => $data.inputHovering = true),
      onMouseleave: _cache[25] || (_cache[25] = $event => $data.inputHovering = false)
    }, [$props.multiple ? (vue.openBlock(), vue.createBlock("div", {
      key: 0,
      class: "el-select__tags",
      ref: "tags",
      style: {
        'max-width': $data.inputWidth - 32 + 'px',
        width: '100%'
      }
    }, [$props.collapseTags && $data.selected.length ? (vue.openBlock(), vue.createBlock("span", _hoisted_1$P, [vue.createVNode(_component_el_tag, {
      closable: !$options.selectDisabled,
      size: $options.collapseTagSize,
      hit: $data.selected[0].hitState,
      type: "info",
      onClose: _cache[1] || (_cache[1] = $event => $options.deleteTag($event, $data.selected[0])),
      "disable-transitions": ""
    }, {
      default: vue.withCtx(() => [vue.createVNode("span", _hoisted_2$y, vue.toDisplayString($data.selected[0].currentLabel), 1
      /* TEXT */
      )]),
      _: 1
      /* STABLE */

    }, 8
    /* PROPS */
    , ["closable", "size", "hit"]), $data.selected.length > 1 ? (vue.openBlock(), vue.createBlock(_component_el_tag, {
      key: 0,
      closable: false,
      size: $options.collapseTagSize,
      type: "info",
      "disable-transitions": ""
    }, {
      default: vue.withCtx(() => [vue.createVNode("span", _hoisted_3$r, "+ " + vue.toDisplayString($data.selected.length - 1), 1
      /* TEXT */
      )]),
      _: 1
      /* STABLE */

    }, 8
    /* PROPS */
    , ["size"])) : vue.createCommentVNode("v-if", true)])) : vue.createCommentVNode("v-if", true), !$props.collapseTags ? (vue.openBlock(), vue.createBlock(vue.TransitionGroup, {
      key: 1,
      onAfterLeave: $options.resetInputHeight
    }, {
      default: vue.withCtx(() => [vue.createVNode("span", null, [(vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList($data.selected, item => {
        return vue.openBlock(), vue.createBlock(_component_el_tag, {
          key: $options.getValueKey(item),
          closable: !$options.selectDisabled,
          size: $options.collapseTagSize,
          hit: item.hitState,
          type: "info",
          onClose: $event => $options.deleteTag($event, item),
          "disable-transitions": ""
        }, {
          default: vue.withCtx(() => [vue.createVNode("span", _hoisted_4$g, vue.toDisplayString(item.currentLabel), 1
          /* TEXT */
          )]),
          _: 2
          /* DYNAMIC */

        }, 1032
        /* PROPS, DYNAMIC_SLOTS */
        , ["closable", "size", "hit", "onClose"]);
      }), 128
      /* KEYED_FRAGMENT */
      ))])]),
      _: 1
      /* STABLE */

    }, 8
    /* PROPS */
    , ["onAfterLeave"])) : vue.createCommentVNode("v-if", true), $props.filterable ? vue.withDirectives((vue.openBlock(), vue.createBlock("input", {
      key: 2,
      type: "text",
      class: ["el-select__input", [$options.selectSize ? `is-${$options.selectSize}` : '']],
      disabled: $options.selectDisabled,
      autocomplete: $props.autoComplete || $props.autocomplete,
      onFocus: _cache[2] || (_cache[2] = (...args) => $options.handleFocus && $options.handleFocus(...args)),
      onBlur: _cache[3] || (_cache[3] = $event => $data.softFocus = false),
      onKeyup: _cache[4] || (_cache[4] = (...args) => $options.managePlaceholder && $options.managePlaceholder(...args)),
      onKeydown: [_cache[5] || (_cache[5] = (...args) => $options.resetInputState && $options.resetInputState(...args)), _cache[6] || (_cache[6] = vue.withKeys(vue.withModifiers($event => _ctx.navigateOptions('next'), ["prevent"]), ["down"])), _cache[7] || (_cache[7] = vue.withKeys(vue.withModifiers($event => _ctx.navigateOptions('prev'), ["prevent"]), ["up"])), _cache[8] || (_cache[8] = vue.withKeys(vue.withModifiers((...args) => $options.selectOption && $options.selectOption(...args), ["prevent"]), ["enter"])), _cache[9] || (_cache[9] = vue.withKeys(vue.withModifiers($event => $data.visible = false, ["stop", "prevent"]), ["esc"])), _cache[10] || (_cache[10] = vue.withKeys((...args) => $options.deletePrevTag && $options.deletePrevTag(...args), ["delete"])), _cache[11] || (_cache[11] = vue.withKeys($event => $data.visible = false, ["tab"]))],
      onCompositionstart: _cache[12] || (_cache[12] = (...args) => $options.handleComposition && $options.handleComposition(...args)),
      onCompositionupdate: _cache[13] || (_cache[13] = (...args) => $options.handleComposition && $options.handleComposition(...args)),
      onCompositionend: _cache[14] || (_cache[14] = (...args) => $options.handleComposition && $options.handleComposition(...args)),
      "onUpdate:modelValue": _cache[15] || (_cache[15] = $event => $data.query = $event),
      onInput: _cache[16] || (_cache[16] = (...args) => _ctx.debouncedQueryChange && _ctx.debouncedQueryChange(...args)),
      style: {
        'flex-grow': '1',
        width: $data.inputLength / ($data.inputWidth - 32) + '%',
        'max-width': $data.inputWidth - 42 + 'px'
      },
      ref: "input"
    }, null, 46
    /* CLASS, STYLE, PROPS, HYDRATE_EVENTS */
    , ["disabled", "autocomplete"])), [[vue.vModelText, $data.query]]) : vue.createCommentVNode("v-if", true)], 4
    /* STYLE */
    )) : vue.createCommentVNode("v-if", true), vue.createVNode(_component_el_input, {
      ref: "reference",
      modelValue: $data.selectedLabel,
      "onUpdate:modelValue": _cache[18] || (_cache[18] = $event => $data.selectedLabel = $event),
      type: "text",
      placeholder: $data.currentPlaceholder,
      name: $props.name,
      id: $props.id,
      autocomplete: $props.autoComplete || $props.autocomplete,
      size: $options.selectSize,
      disabled: $options.selectDisabled,
      readonly: $options.readonly,
      "validate-event": false,
      class: {
        'is-focus': $data.visible
      },
      tabindex: $props.multiple && $props.filterable ? '-1' : null,
      onFocus: $options.handleFocus,
      onBlur: $options.handleBlur,
      onKeyup: _ctx.debouncedOnInputChange,
      onKeydown: [_cache[19] || (_cache[19] = vue.withKeys(vue.withModifiers($event => _ctx.navigateOptions('next'), ["stop", "prevent"]), ["down"])), _cache[20] || (_cache[20] = vue.withKeys(vue.withModifiers($event => _ctx.navigateOptions('prev'), ["stop", "prevent"]), ["up"])), vue.withKeys(vue.withModifiers($options.selectOption, ["prevent"]), ["enter"]), _cache[21] || (_cache[21] = vue.withKeys(vue.withModifiers($event => $data.visible = false, ["stop", "prevent"]), ["esc"])), _cache[22] || (_cache[22] = vue.withKeys($event => $data.visible = false, ["tab"]))],
      onPaste: _ctx.debouncedOnInputChange
    }, vue.createSlots({
      suffix: vue.withCtx(() => [vue.withDirectives(vue.createVNode("i", {
        class: ['el-select__caret', 'el-input__icon', 'el-icon-' + $options.iconClass]
      }, null, 2
      /* CLASS */
      ), [[vue.vShow, !$options.showClose]]), $options.showClose ? (vue.openBlock(), vue.createBlock("i", {
        key: 0,
        class: "el-select__caret el-input__icon el-icon-circle-close",
        onClick: _cache[17] || (_cache[17] = (...args) => $options.handleClearClick && $options.handleClearClick(...args))
      })) : vue.createCommentVNode("v-if", true)]),
      _: 2
      /* DYNAMIC */

    }, [_ctx.$slots.prefix ? {
      name: "prefix",
      fn: vue.withCtx(() => [vue.renderSlot(_ctx.$slots, "prefix")])
    } : undefined]), 1032
    /* PROPS, DYNAMIC_SLOTS */
    , ["modelValue", "placeholder", "name", "id", "autocomplete", "size", "disabled", "readonly", "class", "tabindex", "onFocus", "onBlur", "onKeyup", "onKeydown", "onPaste"]), vue.createVNode(vue.Transition, {
      name: "el-zoom-in-top",
      onBeforeEnter: $options.handleMenuEnter,
      onAfterLeave: $options.doDestroy
    }, {
      default: vue.withCtx(() => [vue.withDirectives(vue.createVNode(_component_el_select_menu, {
        ref: "popper",
        "append-to-body": $props.popperAppendToBody
      }, {
        default: vue.withCtx(() => [vue.withDirectives(vue.createVNode(_component_el_scrollbar, {
          tag: "ul",
          "wrap-class": "el-select-dropdown__wrap",
          "view-class": "el-select-dropdown__list",
          ref: "scrollbar",
          class: {
            'is-empty': !$props.allowCreate && $data.query && $data.filteredOptionsCount === 0
          }
        }, {
          default: vue.withCtx(() => [$options.showNewOption ? (vue.openBlock(), vue.createBlock(_component_el_option, {
            key: 0,
            value: $data.query,
            created: ""
          }, null, 8
          /* PROPS */
          , ["value"])) : vue.createCommentVNode("v-if", true), vue.renderSlot(_ctx.$slots, "default")]),
          _: 3
          /* FORWARDED */

        }, 8
        /* PROPS */
        , ["class"]), [[vue.vShow, $data.options.length > 0 && !$props.loading]]), $options.emptyText && (!$props.allowCreate || $props.loading || $props.allowCreate && $data.options.length === 0) ? (vue.openBlock(), vue.createBlock(vue.Fragment, {
          key: 0
        }, [_ctx.$slots.empty ? vue.renderSlot(_ctx.$slots, "empty", {
          key: 0
        }) : (vue.openBlock(), vue.createBlock("p", _hoisted_5$c, vue.toDisplayString($options.emptyText), 1
        /* TEXT */
        ))], 64
        /* STABLE_FRAGMENT */
        )) : vue.createCommentVNode("v-if", true)]),
        _: 1
        /* STABLE */

      }, 8
      /* PROPS */
      , ["append-to-body"]), [[vue.vShow, $data.visible && $options.emptyText !== false]])]),
      _: 1
      /* STABLE */

    }, 8
    /* PROPS */
    , ["onBeforeEnter", "onAfterLeave"])], 34
    /* CLASS, HYDRATE_EVENTS */
    )), [[_directive_clickoutside, $options.handleClose]]);
  }

  script$1g.render = render$17;
  script$1g.__file = "packages/select/Select.vue";

  /* istanbul ignore next */

  script$1g.install = function (app) {
    app.component(script$1g.name, script$1g);
  };

  /* istanbul ignore next */

  script$1i.install = function (app) {
    app.component(script$1i.name, script$1i);
  };

  var script$1f = {
    name: 'ElOptionGroup',
    componentName: 'ElOptionGroup',
    props: {
      label: String,
      disabled: {
        type: Boolean,
        default: false
      }
    },

    setup(props) {
      const {
        disabled
      } = vue.toRefs(props);
      const visible = vue.ref(true);
      const {
        on,
        broadcast
      } = useEmitter();
      const {
        proxy
      } = vue.getCurrentInstance();
      vue.watch(disabled, val => {
        broadcast('handleGroupDisabled', val);
      });

      function queryChange() {
        visible.value = proxy.$children && Array.isArray(proxy.$children) && proxy.$children.some(option => option.visible === true);
      }

      vue.onBeforeMount(() => {
        on('optionGroup.queryChange', queryChange);
      });
      vue.onMounted(() => {
        if (vue.unref(disabled)) {
          broadcast('handleGroupDisabled', vue.unref(disabled));
        }
      });
      return {
        visible
      };
    }

  };

  const _hoisted_1$O = {
    class: "el-select-group__wrap"
  };
  const _hoisted_2$x = {
    class: "el-select-group__title"
  };
  const _hoisted_3$q = {
    class: "el-select-group"
  };
  function render$16(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.withDirectives((vue.openBlock(), vue.createBlock("ul", _hoisted_1$O, [vue.createVNode("li", _hoisted_2$x, vue.toDisplayString($props.label), 1
    /* TEXT */
    ), vue.createVNode("li", null, [vue.createVNode("ul", _hoisted_3$q, [vue.renderSlot(_ctx.$slots, "default")])])], 512
    /* NEED_PATCH */
    )), [[vue.vShow, $setup.visible]]);
  }

  script$1f.render = render$16;
  script$1f.__file = "packages/option-group/OptionGroup.vue";

  /* istanbul ignore next */

  script$1f.install = function (app) {
    app.component(script$1f.name, script$1f);
  };

  const stop$1 = e => e.stopPropagation();
  /**
   * @param {HTMLElement} [reference=$refs.reference] - The reference element used to position the popper.
   * @param {HTMLElement} [popper=$refs.popper] - The HTML element used as popper, or a configuration used to generate the popper.
   * @param {String} [placement=button] - Placement of the popper accepted values: top(-start, -end), right(-start, -end), bottom(-start, -end), left(-start, -end)
   * @param {Number} [offset=0] - Amount of pixels the popper will be shifted (can be negative).
   * @param {Boolean} [visible=false] Visibility of the popup element.
   * @param {Boolean} [visible-arrow=false] Visibility of the arrow, no style.
   */


  var Popper = {
    props: {
      transformOrigin: {
        type: [Boolean, String],
        default: true
      },
      placement: {
        type: String,
        default: 'bottom'
      },
      boundariesPadding: {
        type: Number,
        default: 5
      },
      reference: {},
      popper: {},
      offset: {
        default: 0
      },
      value: Boolean,
      visibleArrow: Boolean,
      arrowOffset: {
        type: Number,
        default: 35
      },
      appendToBody: {
        type: Boolean,
        default: true
      },
      popperOptions: {
        type: Object,

        default() {
          return {
            gpuAcceleration: false
          };
        }

      }
    },

    data() {
      return {
        showPopper: false,
        currentPlacement: ''
      };
    },

    watch: {
      value: {
        immediate: true,

        handler(val) {
          this.showPopper = val;
          this.$emit('input', val);
        }

      },

      showPopper(val) {
        if (this.disabled) return;
        val ? this.updatePopper() : this.destroyPopper();
        this.$emit('input', val);
      }

    },
    methods: {
      createPopper() {
        if (this.$isServer) return;
        this.currentPlacement = this.currentPlacement || this.placement;

        if (!/^(top|bottom|left|right)(-start|-end)?$/g.test(this.currentPlacement)) {
          return;
        }

        const options = this.popperOptions;
        const popper = this.popperElm = this.popperElm || this.popper || this.$refs.popper;
        let reference = this.referenceElm = this.referenceElm || this.reference || this.$refs.reference;

        if (!reference && this.$slots.reference && this.$slots.reference[0]) {
          reference = this.referenceElm = this.$slots.reference[0].elm;
        }

        if (!popper || !reference) return;
        if (this.visibleArrow) this.appendArrow(popper);
        if (this.appendToBody) document.body.appendChild(this.popperElm);

        if (this.popperJS && this.popperJS.destroy) {
          this.popperJS.destroy();
        }

        options.placement = this.currentPlacement;
        options.offset = this.offset;
        options.arrowOffset = this.arrowOffset;
        this.popperJS = new Popper$1(reference, popper, options);
        this.popperJS.onCreate(() => {
          this.$emit('created', this);
          this.resetTransformOrigin();
          this.$nextTick(this.updatePopper);
        });

        if (typeof options.onUpdate === 'function') {
          this.popperJS.onUpdate(options.onUpdate);
        }

        this.popperJS._popper.style.zIndex = PopupManager.nextZIndex();
        this.popperElm.addEventListener('click', stop$1);
      },

      updatePopper() {
        const popperJS = this.popperJS;

        if (popperJS) {
          popperJS.update();

          if (popperJS._popper) {
            popperJS._popper.style.zIndex = PopupManager.nextZIndex();
          }
        } else {
          this.createPopper();
        }
      },

      doDestroy(forceDestroy) {
        /* istanbul ignore if */
        if (!this.popperJS || this.showPopper && !forceDestroy) return;
        this.popperJS.destroy();
        this.popperJS = null;
      },

      destroyPopper() {
        if (this.popperJS) {
          this.resetTransformOrigin();
        }
      },

      resetTransformOrigin() {
        if (!this.transformOrigin) return;
        const placementMap = {
          top: 'bottom',
          bottom: 'top',
          left: 'right',
          right: 'left'
        };

        const placement = this.popperJS._popper.getAttribute('x-placement').split('-')[0];

        const origin = placementMap[placement];
        this.popperJS._popper.style.transformOrigin = typeof this.transformOrigin === 'string' ? this.transformOrigin : ['top', 'bottom'].indexOf(placement) > -1 ? `center ${origin}` : `${origin} center`;
      },

      appendArrow(element) {
        let hash;

        if (this.appended) {
          return;
        }

        this.appended = true;

        for (const item in element.attributes) {
          if (/^_v-/.test(element.attributes[item].name)) {
            hash = element.attributes[item].name;
            break;
          }
        }

        const arrow = document.createElement('div');

        if (hash) {
          arrow.setAttribute(hash, '');
        }

        arrow.setAttribute('x-arrow', '');
        arrow.className = 'popper__arrow';
        element.appendChild(arrow);
      }

    },

    beforeUnmount() {
      this.doDestroy(true);

      if (this.popperElm && this.popperElm.parentNode === document.body) {
        this.popperElm.removeEventListener('click', stop$1);
        document.body.removeChild(this.popperElm);
      }
    },

    // call destroy in keep-alive mode
    deactivated() {
      this.$options.beforeUnmount[0].call(this);
    }

  };

  function migrating(options) {
    vue.onMounted(() => {
      const componentInstance = vue.getCurrentInstance();
      const componentName = componentInstance.type.name || '';
      const attrs = componentInstance.proxy.$attrs;

      for (const key in options) {
        if (attrs[key]) {
          const warn = options[key];
          const type = isOn(key) ? 'Event' : 'Attribute';
          console.warn(`[Element Migrating][${componentName}][${type}]: ${warn}`);
        }
      }
    });
  }

  var script$1e = {
    components: {
      ElCheckbox: script$1o,
      ElRadio: script$1r,

      renderHelper(props) {
        const {
          render,
          node
        } = props.nodeLabel;
        const vNode = render ? render({
          node: node.value,
          data: node.value.data
        }) : null;
        const res = vNode || node.value.label;
        return vue.h(vue.Fragment, {}, [res]);
      }

    },
    emits: ['created', 'expand'],
    props: {
      node: {
        required: true
      },
      nodeId: String
    },

    setup(props, {
      emit
    }) {
      const {
        node
      } = vue.toRefs(props);
      const {
        panel,
        config,
        checkedValue,
        inActivePath,
        inCheckedPath
      } = usePanel(node);
      const {
        value,
        loading,
        isLeaf,
        isDisabled,
        isChecked
      } = useNode(node, checkedValue);
      const nodeLabel = vue.computed(() => ({
        node
      }));
      const disabled = vue.computed(() => !config.value.checkStrictly && isDisabled.value);
      vue.watchEffect(() => {
        if (isEqual(value.value, checkedValue.value)) value.value = checkedValue.value;
      });

      const handleMultiCheckChange = checked => {
        node.value.doCheck(checked);
        panel.calculateMultiCheckedValue();
      };

      const handleExpand = () => {
        if (!config.value.checkStrictly && isDisabled.value || node.value.loading) return;

        if (config.value.lazy && !node.value.loaded) {
          panel.lazyLoad(node.value, () => {
            // do not use cached leaf value here, invoke this.isLeaf to get new value.
            if (!isLeaf.value) handleExpand();

            if (config.value.multiple) {
              // if leaf sync checked state, else clear checked state
              const checked = isLeaf.value ? node.value.checked : false;
              handleMultiCheckChange(checked);
            }
          });
        } else {
          panel.handleExpand(node.value);
        }
      };

      const handleCheckChange = () => {
        panel.handleCheckChange(value);
        panel.handleExpand(node.value);
      };

      const handleClick = () => {
        if (isLeaf.value && !isDisabled.value && !config.value.checkStrictly && !config.value.multiple) {
          handleCheckChange();
        }

        if (config.value.expandTrigger !== 'click') return;
        if (config.value.expandTrigger === 'click') handleExpand();
      };

      const handleMouseenter = e => {
        if (config.value.expandTrigger === 'click') return;
        handleExpand();
        emit('expand', e);
      };

      return {
        // state
        // data
        nodeLabel,
        disabled,
        // useNode
        value,
        loading,
        isChecked,
        isLeaf,
        isDisabled,
        // usePanel
        config,
        inActivePath,
        checkedValue,
        inCheckedPath,

        // methods
        strictlyEvent() {},

        handleClick,
        handleMouseenter,
        handleCheckChange,
        handleMultiCheckChange,
        handleExpand
      };
    }

  };

  const useNode = (node, checkedValue) => {
    let value = node.value.getValueByOption();
    vue.watch(node.value, newValue => {
      value = newValue.getValueByOption();
    });
    const loading = vue.computed(() => node.value.loading);
    const isLeaf = vue.computed(() => node.value.isLeaf);
    const isDisabled = vue.computed(() => node.value.isDisabled);
    const isChecked = vue.computed(() => node.value.isSameNode(checkedValue.value));
    return {
      value,
      loading,
      isLeaf,
      isDisabled,
      isChecked
    };
  };

  const usePanel = node => {
    const isInPath = pathNodes => {
      const selectedPathNode = (pathNodes === null || pathNodes === void 0 ? void 0 : pathNodes[(node === null || node === void 0 ? void 0 : node.value.level) - 1]) || {};
      return selectedPathNode.uid === (node === null || node === void 0 ? void 0 : node.value.uid);
    };

    const panel = vue.inject('panel');
    const config = vue.computed(() => panel.config);
    const checkedValue = vue.computed(() => panel.checkedValue);
    const inActivePath = vue.computed(() => isInPath(panel.activePath));
    const inCheckedPath = vue.computed(() => {
      if (!config.value.checkStrictly) return false;
      return panel.checkedNodePaths.some(checkedPath => isInPath(checkedPath));
    });
    return {
      panel,
      config,
      checkedValue,
      inActivePath,
      inCheckedPath
    };
  };

  const _hoisted_1$N = /*#__PURE__*/vue.createVNode("span", null, null, -1
  /* HOISTED */
  );

  const _hoisted_2$w = {
    key: 2,
    class: "el-icon-check el-cascader-node__prefix"
  };
  const _hoisted_3$p = {
    class: "el-cascader-node__label"
  };
  const _hoisted_4$f = {
    key: 1,
    class: "el-icon-loading el-cascader-node__postfix"
  };
  const _hoisted_5$b = {
    key: 2,
    class: "el-icon-arrow-right el-cascader-node__postfix"
  };
  function render$15(_ctx, _cache, $props, $setup, $data, $options) {
    const _component_el_checkbox = vue.resolveComponent("el-checkbox");

    const _component_el_radio = vue.resolveComponent("el-radio");

    const _component_render_helper = vue.resolveComponent("render-helper");

    return vue.openBlock(), vue.createBlock("li", {
      role: "menuitem",
      id: $props.nodeId,
      "aria-expanded": $setup.inActivePath,
      tabindex: !$setup.config.checkStrictly && $setup.isDisabled ? null : -1,
      class: {
        'el-cascader-node': true,
        'is-selectable': $setup.config.checkStrictly,
        'in-active-path': $setup.inActivePath,
        'in-checked-path': $setup.inCheckedPath,
        'is-active': $setup.isChecked,
        'is-disabled': $setup.disabled
      },
      onClick: _cache[2] || (_cache[2] = (...args) => $setup.handleClick && $setup.handleClick(...args)),
      onMouseenter: _cache[3] || (_cache[3] = (...args) => $setup.handleMouseenter && $setup.handleMouseenter(...args)),
      onFocus: _cache[4] || (_cache[4] = (...args) => $setup.handleMouseenter && $setup.handleMouseenter(...args))
    }, [$setup.config.multiple || $setup.config.checkStrictly || $setup.isLeaf && $setup.isChecked ? (vue.openBlock(), vue.createBlock(vue.Fragment, {
      key: 0
    }, [$setup.config.multiple ? (vue.openBlock(), vue.createBlock(_component_el_checkbox, {
      key: 0,
      modelValue: $props.node.checked,
      indeterminate: $props.node.indeterminate,
      disabled: $setup.isDisabled,
      "onUpdate:modelValue": $setup.handleMultiCheckChange,
      onClick: _cache[1] || (_cache[1] = vue.withModifiers(() => {
        $setup.config.checkStrictly && $setup.strictlyEvent();
      }, ["stop"]))
    }, null, 8
    /* PROPS */
    , ["modelValue", "indeterminate", "disabled", "onUpdate:modelValue"])) : $setup.config.checkStrictly ? (vue.openBlock(), vue.createBlock(_component_el_radio, {
      key: 1,
      modelValue: $setup.checkedValue,
      label: $setup.value,
      disabled: $setup.isDisabled,
      onChange: $setup.handleCheckChange,
      onClick: $setup.strictlyEvent
    }, {
      default: vue.withCtx(() => [_hoisted_1$N]),
      _: 1
      /* STABLE */

    }, 8
    /* PROPS */
    , ["modelValue", "label", "disabled", "onChange", "onClick"])) : $setup.isLeaf && $setup.isChecked ? (vue.openBlock(), vue.createBlock("i", _hoisted_2$w)) : vue.createCommentVNode("v-if", true)], 64
    /* STABLE_FRAGMENT */
    )) : vue.createCommentVNode("v-if", true), vue.createVNode("span", _hoisted_3$p, [vue.createVNode(_component_render_helper, {
      nodeLabel: $setup.nodeLabel
    }, null, 8
    /* PROPS */
    , ["nodeLabel"])]), $setup.loading ? (vue.openBlock(), vue.createBlock("i", _hoisted_4$f)) : !$setup.isLeaf ? (vue.openBlock(), vue.createBlock("i", _hoisted_5$b)) : vue.createCommentVNode("v-if", true)], 42
    /* CLASS, PROPS, HYDRATE_EVENTS */
    , ["id", "aria-expanded", "tabindex"]);
  }

  script$1e.render = render$15;
  script$1e.__file = "packages/cascader-panel/CascaderNode.vue";

  function useLocale() {
    return function (...args) {
      const instance = vue.getCurrentInstance();
      return t.apply(instance, args);
    };
  }

  var script$1d = {
    name: 'ElCascaderMenu',
    components: {
      ElScrollbar,
      CascaderNode: script$1e
    },
    props: {
      nodes: {
        type: Array,
        required: true
      },
      index: Number
    },

    setup(props) {
      const instance = vue.getCurrentInstance();
      const t = useLocale();
      const {
        index,
        nodes
      } = vue.toRefs(props);
      const {
        proxy
      } = instance;
      const panel = vue.inject('panel');
      const hoverZone = vue.ref(null);
      const data = {
        activeNode: null,
        hoverTimer: null,
        id: generateId()
      };
      const isEmpty = vue.computed(() => !nodes.value.length);
      const menuId = `cascader-menu-${data.id}-${index.value}`;

      const clearHoverZone = () => {
        if (!hoverZone.value) return;
        hoverZone.value.innerHTML = '';
      };

      const handleExpand = e => {
        if (!panel.isHoverMenu) return;
        data.activeNode = e.target;
      };

      const handleMouseMove = e => {
        if (!panel.isHoverMenu) return;
        if (!data.activeNode || !hoverZone.value) return;

        if (data.activeNode.contains(e.target)) {
          clearTimeout(data.hoverTimer);
          const {
            left
          } = proxy.$el.getBoundingClientRect();
          const startX = e.clientX - left;
          const {
            offsetWidth,
            offsetHeight
          } = proxy.$el;
          const top = data.activeNode.offsetTop;
          const bottom = top + data.activeNode.offsetHeight;
          hoverZone.value.innerHTML = `
          <path style="pointer-events: auto;" fill="transparent" d="M${startX} ${top} L${offsetWidth} 0 V${top} Z" />
          <path style="pointer-events: auto;" fill="transparent" d="M${startX} ${bottom} L${offsetWidth} ${offsetHeight} V${bottom} Z" />
        `;
        } else if (!data.hoverTimer) {
          data.hoverTimer = setTimeout(clearHoverZone, panel.config.hoverThreshold);
        }
      };

      return {
        // state
        data,
        isEmpty,
        menuId,
        hoverZone,
        panel,
        // methods
        t,
        handleExpand,
        handleMouseMove
      };
    }

  };

  const _hoisted_1$M = {
    key: 0,
    class: "el-cascader-menu__empty-text"
  };
  const _hoisted_2$v = {
    key: 0,
    ref: "hoverZone",
    class: "el-cascader-menu__hover-zone"
  };
  function render$14(_ctx, _cache, $props, $setup, $data, $options) {
    const _component_cascader_node = vue.resolveComponent("cascader-node");

    const _component_el_scrollbar = vue.resolveComponent("el-scrollbar");

    return vue.openBlock(), vue.createBlock(_component_el_scrollbar, {
      tag: "ul",
      role: "menu",
      id: $setup.menuId,
      class: "el-cascader-menu",
      "wrap-class": "el-cascader-menu__wrap",
      "view-class": {
        'el-cascader-menu__list': true,
        'is-empty': $setup.isEmpty
      },
      onMousemove: $setup.handleMouseMove
    }, {
      default: vue.withCtx(() => [$setup.isEmpty ? (vue.openBlock(), vue.createBlock("div", _hoisted_1$M, vue.toDisplayString($setup.t('el.cascader.noData')), 1
      /* TEXT */
      )) : (vue.openBlock(), vue.createBlock(vue.Fragment, {
        key: 1
      }, [(vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList($props.nodes, (node, index) => {
        return vue.openBlock(), vue.createBlock(_component_cascader_node, {
          key: node.uid,
          node: node,
          "node-id": `${$setup.menuId}-${index}`,
          "aria-haspopup": node.hasChildren,
          "aria-owns": node.hasChildren ? $setup.menuId : null,
          onExpand: $setup.handleExpand
        }, null, 8
        /* PROPS */
        , ["node", "node-id", "aria-haspopup", "aria-owns", "onExpand"]);
      }), 128
      /* KEYED_FRAGMENT */
      )), $setup.panel.isHoverMenu ? (vue.openBlock(), vue.createBlock("svg", _hoisted_2$v, null, 512
      /* NEED_PATCH */
      )) : vue.createCommentVNode("v-if", true)], 64
      /* STABLE_FRAGMENT */
      ))]),
      _: 1
      /* STABLE */

    }, 8
    /* PROPS */
    , ["id", "view-class", "onMousemove"]);
  }

  script$1d.render = render$14;
  script$1d.__file = "packages/cascader-panel/CascaderMenu.vue";

  let uid = 0;
  class Node$1 {
    constructor(data, config, parentNode) {
      this.data = data;
      this.config = config;
      this.parent = parentNode || null;
      this.level = !this.parent ? 1 : this.parent.level + 1;
      this.uid = uid++;
      this.initState();
      this.initChildren();
    }

    initState() {
      const {
        value: valueKey,
        label: labelKey
      } = this.config;
      this.value = this.data[valueKey];
      this.label = this.data[labelKey];
      this.pathNodes = this.calculatePathNodes();
      this.path = this.pathNodes.map(node => node.value);
      this.pathLabels = this.pathNodes.map(node => node.label); // lazy load

      this.loading = false;
      this.loaded = false;
    }

    initChildren() {
      const {
        config
      } = this;
      const childrenKey = config.children;
      const childrenData = this.data[childrenKey];
      this.hasChildren = Array.isArray(childrenData);
      this.children = (childrenData || []).map(child => new Node$1(child, config, this));
    }

    get isDisabled() {
      const {
        data,
        parent,
        config
      } = this;
      const disabledKey = config.disabled;
      const {
        checkStrictly
      } = config;
      return data[disabledKey] || !checkStrictly && parent && parent.isDisabled;
    }

    get isLeaf() {
      const {
        data,
        loaded,
        hasChildren,
        children
      } = this;
      const {
        lazy,
        leaf: leafKey
      } = this.config;

      if (lazy) {
        const isLeaf = isDef(data[leafKey]) ? data[leafKey] : loaded ? !children.length : false;
        this.hasChildren = !isLeaf;
        return isLeaf;
      }

      return !hasChildren;
    }

    calculatePathNodes() {
      const nodes = [this];
      let parent = this.parent;

      while (parent) {
        nodes.unshift(parent);
        parent = parent.parent;
      }

      return nodes;
    }

    getPath() {
      return this.path;
    }

    getValue() {
      return this.value;
    }

    getValueByOption() {
      return this.config.emitPath ? this.getPath() : this.getValue();
    }

    getText(allLevels, separator) {
      return allLevels ? this.pathLabels.join(separator) : this.label;
    }

    isSameNode(checkedValue) {
      const value = this.getValueByOption();
      return this.config.multiple && Array.isArray(checkedValue) ? checkedValue.some(val => isEqual(val, value)) : isEqual(checkedValue, value);
    }

    broadcast(event, ...args) {
      const handlerName = `onParent${capitalize(event)}`;
      this.children.forEach(child => {
        if (child) {
          // bottom up
          child.broadcast(event, ...args);
          child[handlerName] && child[handlerName](...args);
        }
      });
    }

    emit(event, ...args) {
      const {
        parent
      } = this;
      const handlerName = `onChild${capitalize(event)}`;

      if (parent) {
        parent[handlerName] && parent[handlerName](...args);
        parent.emit(event, ...args);
      }
    }

    onParentCheck(checked) {
      if (!this.isDisabled) {
        this.setCheckState(checked);
      }
    }

    onChildCheck() {
      const {
        children
      } = this;
      const validChildren = children.filter(child => !child.isDisabled);
      const checked = validChildren.length ? validChildren.every(child => child.checked) : false;
      this.setCheckState(checked);
    }

    setCheckState(checked) {
      const totalNum = this.children.length;
      const checkedNum = this.children.reduce((c, p) => {
        const num = p.checked ? 1 : p.indeterminate ? 0.5 : 0;
        return c + num;
      }, 0);
      this.checked = checked;
      this.indeterminate = checkedNum !== totalNum && checkedNum > 0;
    }

    syncCheckState(checkedValue) {
      const value = this.getValueByOption();
      const checked = this.isSameNode(checkedValue, value);
      this.doCheck(checked);
    }

    doCheck(checked) {
      if (this.checked !== checked) {
        if (this.config.checkStrictly) {
          this.checked = checked;
        } else {
          // bottom up to unify the calculation of the indeterminate state
          this.broadcast('check', checked);
          this.setCheckState(checked);
          this.emit('check');
        }
      }
    }

  }

  const flatNodes = (data, leafOnly) => {
    return data.reduce((res, node) => {
      if (node.isLeaf) {
        res.push(node);
      } else {
        !leafOnly && res.push(node);
        res = res.concat(flatNodes(node.children, leafOnly));
      }

      return res;
    }, []);
  };

  class Store {
    constructor(data, config) {
      this.config = config;
      this.initNodes(data);
    }

    initNodes(data) {
      data = coerceTruthyValueToArray(data);
      this.nodes = data.map(nodeData => new Node$1(nodeData, this.config));
      this.flattedNodes = this.getFlattedNodes(false, false);
      this.leafNodes = this.getFlattedNodes(true, false);
    }

    appendNode(nodeData, parentNode) {
      const node = new Node$1(nodeData, this.config, parentNode);
      const children = parentNode ? parentNode.children : this.nodes;
      children.push(node);
    }

    appendNodes(nodeDataList, parentNode) {
      nodeDataList = coerceTruthyValueToArray(nodeDataList);
      nodeDataList.forEach(nodeData => this.appendNode(nodeData, parentNode));
    }

    getNodes() {
      return this.nodes;
    }

    getFlattedNodes(leafOnly, cached = true) {
      const cachedNodes = leafOnly ? this.leafNodes : this.flattedNodes;
      return cached ? cachedNodes : flatNodes(this.nodes, leafOnly);
    }

    getNodeByValue(value) {
      if (value) {
        const nodes = this.getFlattedNodes(false, !this.config.lazy).filter(node => valueEquals(node.path, value) || node.value === value);
        return nodes && nodes.length ? nodes[0] : null;
      }

      return null;
    }

  }

  // eslint-disable-next-line no-use-before-define
  var aria$1 = aria$1 || {};
  aria$1.Utils = aria$1.Utils || {};
  /**
   * @desc Set focus on descendant nodes until the first focusable element is
   *       found.
   * @param element
   *          DOM node for which to find the first focusable descendant.
   * @returns
   *  true if a focusable element is found and focus is set.
   */

  aria$1.Utils.focusFirstDescendant = function (element) {
    for (var i = 0; i < element.childNodes.length; i++) {
      var child = element.childNodes[i];

      if (aria$1.Utils.attemptFocus(child) || aria$1.Utils.focusFirstDescendant(child)) {
        return true;
      }
    }

    return false;
  };
  /**
   * @desc Find the last descendant node that is focusable.
   * @param element
   *          DOM node for which to find the last focusable descendant.
   * @returns
   *  true if a focusable element is found and focus is set.
   */


  aria$1.Utils.focusLastDescendant = function (element) {
    for (var i = element.childNodes.length - 1; i >= 0; i--) {
      var child = element.childNodes[i];

      if (aria$1.Utils.attemptFocus(child) || aria$1.Utils.focusLastDescendant(child)) {
        return true;
      }
    }

    return false;
  };
  /**
   * @desc Set Attempt to set focus on the current node.
   * @param element
   *          The node to attempt to focus on.
   * @returns
   *  true if element is focused.
   */


  aria$1.Utils.attemptFocus = function (element) {
    if (!aria$1.Utils.isFocusable(element)) {
      return false;
    }

    aria$1.Utils.IgnoreUtilFocusChanges = true;

    if (element && element.focus) {
      element.focus();
    }

    aria$1.Utils.IgnoreUtilFocusChanges = false;
    return document.activeElement === element;
  };

  aria$1.Utils.isFocusable = function (element) {
    if (element.tabIndex > 0 || element.tabIndex === 0 && element.getAttribute('tabIndex') !== null) {
      return true;
    }

    if (element.disabled) {
      return false;
    }

    switch (element.nodeName) {
      case 'A':
        return !!element.href && element.rel !== 'ignore';

      case 'INPUT':
        return element.type !== 'hidden' && element.type !== 'file';

      case 'BUTTON':
      case 'SELECT':
      case 'TEXTAREA':
        return true;

      default:
        return false;
    }
  };
  /**
   * 触发一个事件
   * mouseenter, mouseleave, mouseover, keyup, change, click 等
   * @param  {Element} elm
   * @param  {String} name
   * @param  {*} opts
   */


  aria$1.Utils.triggerEvent = function (elm, name, ...opts) {
    let eventName;

    if (/^mouse|click/.test(name)) {
      eventName = 'MouseEvents';
    } else if (/^key/.test(name)) {
      eventName = 'KeyboardEvent';
    } else {
      eventName = 'HTMLEvents';
    }

    const evt = document.createEvent(eventName);
    evt.initEvent(name, ...opts);
    elm.dispatchEvent ? elm.dispatchEvent(evt) : elm.fireEvent('on' + name, evt);
    return elm;
  };

  aria$1.Utils.keys = {
    tab: 9,
    enter: 13,
    space: 32,
    left: 37,
    up: 38,
    right: 39,
    down: 40,
    esc: 27
  };
  var Utils = aria$1.Utils;

  const {
    keys: KeyCode$1
  } = Utils;
  const DefaultProps = {
    expandTrigger: 'click',
    // or hover
    multiple: false,
    checkStrictly: false,
    // whether all nodes can be selected
    emitPath: true,
    // wether to emit an array of all levels value in which node is located
    lazy: false,
    lazyLoad: noop$1,
    value: 'value',
    label: 'label',
    children: 'children',
    leaf: 'leaf',
    disabled: 'disabled',
    hoverThreshold: 500
  };

  const isLeaf = el => !el.getAttribute('aria-owns');

  const getSibling = (el, distance) => {
    const {
      parentNode
    } = el;

    if (parentNode) {
      const siblings = parentNode.querySelectorAll('.el-cascader-node[tabindex="-1"]');
      const index = Array.prototype.indexOf.call(siblings, el);
      return siblings[index + distance] || null;
    }

    return null;
  };

  const getMenuIndex = el => {
    if (!el) return;
    const pieces = el.id.split('-');
    return Number(pieces[pieces.length - 2]);
  };

  const focusNode = el => {
    if (!el) return;
    el.focus();
    !isLeaf(el) && el.click();
  };

  const checkNode = el => {
    if (!el) return;
    const input = el.querySelector('input');

    if (input) {
      input.click();
    } else if (isLeaf(el)) {
      el.click();
    }
  };

  var script$1c = {
    name: 'ElCascaderPanel',
    components: {
      CascaderMenu: script$1d
    },
    emits: ['update:modelValue', 'change', 'close', 'active-item-change', 'expand-change'],
    props: {
      modelValue: {
        type: Object,
        default: () => {}
      },
      options: Array,
      props: Object,
      border: {
        type: Boolean,
        default: true
      },
      renderLabel: Function,
      computePresentText: Function
    },

    provide() {
      return {
        panel: this
      };
    },

    setup(props, {
      slots,
      emit
    }) {
      const menuRef = vue.ref([]);
      const activePath = vue.ref([]);
      const checkedNodePaths = vue.ref([]);
      const loadCount = vue.ref(0);
      const checkedValue = vue.ref(null);
      const {
        props: realProps,
        options,
        renderLabel,
        modelValue
      } = vue.toRefs(props);
      const renderLabelFn = vue.computed(() => (renderLabel === null || renderLabel === void 0 ? void 0 : renderLabel.value) || (slots === null || slots === void 0 ? void 0 : slots.default));
      const {
        config,
        multiple,
        checkStrictly,
        leafOnly,
        isHoverMenu
      } = useConfig$1(realProps);
      let state = vue.reactive({
        store: null,
        menus: null
      });

      const lazyLoad = (node, onFulfilled) => {
        if (!node) {
          node = {
            root: true,
            level: 0
          };
          state.store = new Store([], config.value);
          state.menus = [state.store.getNodes()];
        }

        node.loading = true;

        const resolve = dataList => {
          const parent = node.root ? null : node;
          dataList && dataList.length && state.store.appendNodes(dataList, parent);
          node.loading = false;
          node.loaded = true; // dispose default value on lazy load mode

          if (Array.isArray(checkedValue.value)) {
            const nodeValue = checkedValue.value[loadCount.value++];
            const valueKey = config.value.value;
            const leafKey = config.value.leaf;

            if (Array.isArray(dataList) && dataList.filter(item => item[valueKey] === nodeValue).length > 0) {
              const checkedNode = state.store.getNodeByValue(nodeValue);

              if (!checkedNode.data[leafKey]) {
                lazyLoad(checkedNode, () => {
                  handleExpand(checkedNode);
                });
              }

              if (loadCount.value === checkedValue.value.length) {
                props.computePresentText();
              }
            }
          }

          onFulfilled && onFulfilled(dataList);
        };

        config.value.lazyLoad(node, resolve);
      };

      const getFlattedNodes = leafOnly => {
        const cached = !config.value.lazy;
        return state.store.getFlattedNodes(leafOnly, cached);
      };

      const {
        handleExpand,
        expandNodes,
        handleKeyDown
      } = useExpendMethods({
        menuRef,
        activePath,
        state,
        emit
      });

      const syncActivePath = () => {
        if (!isEmpty(activePath.value)) {
          const nodes = activePath.value.map(node => state.store.getNodeByValue(node.getValue()));
          expandNodes(nodes);
        } else if (!isEmpty(checkedValue.value)) {
          const value = multiple.value ? checkedValue.value[0] : checkedValue.value;
          const checkedNode = state.store.getNodeByValue(value) || {};
          const nodes = (checkedNode.pathNodes || []).slice(0, -1);
          expandNodes(nodes);
        } else {
          activePath.value = [];
          state.menus = [state.store.getNodes()];
        }
      };

      const changedScrollIntoView = () => {
        const menus = menuRef.value || [];
        menus.forEach(menu => {
          const menuElement = menu.$el;

          if (menuElement) {
            const container = menuElement.querySelector('.el-scrollbar__wrap');
            const activeNode = menuElement.querySelector('.el-cascader-node.is-active') || menuElement.querySelector('.el-cascader-node.in-active-path');
            scrollIntoView(container, activeNode);
          }
        });
      };

      const {
        syncMenuState,
        clearCheckedNodes,
        syncCheckedValue,
        getCheckedNodes,
        calculateCheckedNodePaths,
        calculateMultiCheckedValue
      } = useCheckedMethods({
        state,
        config,
        leafOnly,
        modelValue,
        multiple,
        checkedValue,
        checkedNodePaths,
        syncActivePath,
        scrollIntoView: changedScrollIntoView,
        getFlattedNodes
      });

      const handleCheckChange = value => {
        checkedValue.value = value;
      };

      vue.onMounted(() => {
        if (!isEmpty(modelValue === null || modelValue === void 0 ? void 0 : modelValue.value)) {
          syncCheckedValue();
        }
      });
      vue.onBeforeUpdate(() => {
        menuRef.value = [];
      });
      vue.watch(options, () => {
        if (config.value.lazy && isEmpty(options.value)) {
          lazyLoad();
        } else {
          state.store = new Store(options.value, config.value);
          state.menus = [state.store.getNodes()];
          syncMenuState();
        }
      }, {
        immediate: true,
        deep: true
      });
      vue.watch(modelValue, () => {
        syncCheckedValue();
        checkStrictly.value && calculateCheckedNodePaths();
      });
      vue.watch(checkedValue, val => {
        if (!isEqual(val, modelValue === null || modelValue === void 0 ? void 0 : modelValue.value)) {
          checkStrictly.value && calculateCheckedNodePaths();
          emit('update:modelValue', val);
          emit('change', val);
        }
      });
      return {
        // state
        // ref
        menuRef,
        // data
        checkedValue,
        activePath,
        checkedNodePaths,
        menus: vue.toRefs(state).menus,
        // computed
        config,
        multiple,
        checkStrictly,
        leafOnly,
        isHoverMenu,

        // methods
        getNodeByValue(val) {
          return state.store.getNodeByValue(val);
        },

        lazyLoad,
        getCheckedNodes,
        getFlattedNodes,
        handleCheckChange,
        handleExpand,
        renderLabelFn,
        handleKeyDown,
        clearCheckedNodes,
        calculateMultiCheckedValue,
        scrollIntoView: changedScrollIntoView
      };
    }

  };

  const useConfig$1 = props => {
    const config = vue.computed(() => merge({ ...DefaultProps
    }, props === null || props === void 0 ? void 0 : props.value));
    const multiple = vue.computed(() => config.value.multiple);
    const checkStrictly = vue.computed(() => config.value.checkStrictly);
    const leafOnly = vue.computed(() => !checkStrictly.value);
    const isHoverMenu = vue.computed(() => config.value.expandTrigger === 'trigger');
    return {
      config,
      multiple,
      checkStrictly,
      leafOnly,
      isHoverMenu
    };
  };

  const useExpendMethods = ({
    menuRef,
    activePath,
    state,
    emit
  }) => {
    const handleExpand = (node, silent) => {
      const activePathValue = activePath.value;
      const {
        level
      } = node;
      const path = activePathValue.slice(0, level - 1);
      const internalMenus = [...state.menus].slice(0, level);

      if (!node.isLeaf) {
        path.push(node);
        internalMenus.push(node.children);
      }

      activePath.value = path;
      state.menus = internalMenus;

      if (!silent) {
        const pathValues = path.map(node => node.getValue());
        const activePathValues = activePath.value.map(node => node.getValue());

        if (!valueEquals(pathValues, activePathValues)) {
          emit('active-item-change', pathValues);
          emit('expand-change', pathValues);
        }
      }
    };

    const expandNodes = nodes => {
      nodes.forEach(node => handleExpand(node, true));
    };

    const handleKeyDown = ({
      target,
      keyCode
    }) => {
      const prev = getSibling(target, -1);
      const next = getSibling(target, 1);
      const preMenu = menuRef.value[getMenuIndex(target) - 1];
      const nextMenu = menuRef.value[getMenuIndex(target) + 1];

      switch (keyCode) {
        case KeyCode$1.up:
          focusNode(prev);
          break;

        case KeyCode$1.down:
          focusNode(next);
          break;

        case KeyCode$1.left:
          if (preMenu) {
            const expandedNode = preMenu.$el.querySelector('.el-cascader-node[aria-expanded="true"]');
            focusNode(expandedNode);
          }

          break;

        case KeyCode$1.right:
          if (nextMenu) {
            const firstNode = nextMenu.$el.querySelector('.el-cascader-node[tabindex="-1"]');
            focusNode(firstNode);
          }

          break;

        case KeyCode$1.enter:
          checkNode(target);
          break;

        case KeyCode$1.esc:
        case KeyCode$1.tab:
          emit('close');
          break;

        default:
          return;
      }
    };

    return {
      handleExpand,
      expandNodes,
      handleKeyDown
    };
  };

  const useCheckedMethods = ({
    state,
    config,
    leafOnly,
    modelValue,
    checkedValue,
    checkedNodePaths,
    syncActivePath,
    scrollIntoView,
    getFlattedNodes
  }) => {
    const syncMultiCheckState = () => {
      const nodes = getFlattedNodes(leafOnly.value);
      nodes.forEach(node => {
        node.syncCheckState(checkedValue.value);
      });
    };

    const syncMenuState = async () => {
      syncActivePath();
      config.value.multiple && syncMultiCheckState();
      config.value.checkStrictly && calculateCheckedNodePaths();
      await vue.nextTick(scrollIntoView);
    };

    const syncCheckedValue = () => {
      if (!isEqual(modelValue.value, checkedValue.value)) {
        checkedValue.value = modelValue.value;
        syncMenuState();
      }
    };

    const calculateCheckedNodePaths = () => {
      const checkedValues = config.value.multiple ? coerceTruthyValueToArray(checkedValue.value) : [checkedValue.value];
      checkedNodePaths.value = checkedValues.map(v => {
        var _state$store$getNodeB;

        return ((_state$store$getNodeB = state.store.getNodeByValue(v)) === null || _state$store$getNodeB === void 0 ? void 0 : _state$store$getNodeB.pathNodes) || [];
      });
    };

    const getCheckedNodes = leafOnly => {
      if (config.value.multiple) {
        const nodes = getFlattedNodes(leafOnly);
        return nodes.filter(node => node.checked);
      } else {
        return isEmpty(checkedValue.value) ? [] : [state.store.getNodeByValue(checkedValue.value)];
      }
    };

    const calculateMultiCheckedValue = () => {
      checkedValue.value = getCheckedNodes(leafOnly.value).map(node => node.getValueByOption());
    };

    const clearCheckedNodes = () => {
      if (config.value.multiple) {
        getCheckedNodes(leafOnly.value).filter(node => !node.isDisabled).forEach(node => node.doCheck(false));
        calculateMultiCheckedValue();
      } else {
        checkedValue.value = config.value.emitPath ? [] : null;
      }
    };

    return {
      syncMenuState,
      getCheckedNodes,
      syncCheckedValue,
      clearCheckedNodes,
      calculateCheckedNodePaths,
      calculateMultiCheckedValue
    };
  };

  function render$13(_ctx, _cache, $props, $setup, $data, $options) {
    const _component_cascader_menu = vue.resolveComponent("cascader-menu");

    return vue.openBlock(), vue.createBlock("div", {
      class: ['el-cascader-panel', $props.border && 'is-bordered'],
      onKeydown: _cache[1] || (_cache[1] = (...args) => $setup.handleKeyDown && $setup.handleKeyDown(...args))
    }, [(vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList($setup.menus, (menu, index) => {
      return vue.openBlock(), vue.createBlock(_component_cascader_menu, {
        ref: el => {
          if (el) $setup.menuRef[index] = el;
        },
        index: index,
        key: index,
        nodes: menu
      }, null, 8
      /* PROPS */
      , ["index", "nodes"]);
    }), 128
    /* KEYED_FRAGMENT */
    ))], 34
    /* CLASS, HYDRATE_EVENTS */
    );
  }

  script$1c.render = render$13;
  script$1c.__file = "packages/cascader-panel/CascaderPanel.vue";

  /* istanbul ignore next */

  script$1c.install = function (app) {
    app.component(script$1c.name, script$1c);
  };

  const {
    keys: KeyCode
  } = Utils;
  const MigratingProps = {
    expandTrigger: {
      newProp: 'expandTrigger',
      type: String
    },
    changeOnSelect: {
      newProp: 'checkStrictly',
      type: Boolean
    },
    hoverThreshold: {
      newProp: 'hoverThreshold',
      type: Number
    }
  };
  const PopperMixin = {
    props: {
      placement: {
        type: String,
        default: 'bottom-start'
      },
      appendToBody: Popper.props.appendToBody,
      visibleArrow: {
        type: Boolean,
        default: true
      },
      arrowOffset: Popper.props.arrowOffset,
      offset: Popper.props.offset,
      boundariesPadding: Popper.props.boundariesPadding,
      popperOptions: Popper.props.popperOptions
    },
    methods: Popper.methods,
    data: Popper.data,
    beforeUnmount: Popper.beforeUnmount
  };
  const InputSizeMap = {
    medium: 36,
    small: 32,
    mini: 28
  };
  var script$1b = {
    name: 'ElCascader',
    directives: {
      Clickoutside
    },
    components: {
      ElInput: script$1l,
      ElTag: script$1h,
      ElScrollbar,
      ElCascaderPanel: script$1c
    },
    mixins: [PopperMixin],
    emits: ['update:modelValue', 'change', 'expand-change', 'active-item-change', 'visible-change', 'focus', 'blur', 'created', 'remove-tag'],
    props: {
      modelValue: {},
      options: {
        type: Array,
        default: () => []
      },
      props: Object,
      size: String,
      placeholder: {
        type: String,
        default: () => t('el.cascader.placeholder')
      },
      disabled: {
        type: Boolean,
        default: false
      },
      clearable: Boolean,
      filterable: Boolean,
      filterMethod: {
        type: Function,
        default: undefined
      },
      separator: {
        type: String,
        default: ' / '
      },
      showAllLevels: {
        type: Boolean,
        default: true
      },
      collapseTags: Boolean,
      debounce: {
        type: Number,
        default: 300
      },
      beforeFilter: {
        type: Function,
        default: () => () => {}
      },
      popperClass: String
    },

    setup(props, {
      emit,
      attrs
    }) {
      const instance = vue.getCurrentInstance();
      const {
        dispatch
      } = useEmitter();
      const {
        props: realProps,
        modelValue,
        options,
        filterable,
        size,
        disabled,
        clearable,
        filterMethod,
        showAllLevels,
        separator,
        collapseTags,
        debounce: debounceProp,
        beforeFilter
      } = vue.toRefs(props);
      const t = useLocale();
      migrating({
        'expand-trigger': 'expand-trigger is removed, use `props.expandTrigger` instead.',
        'change-on-select': 'change-on-select is removed, use `props.checkStrictly` instead.',
        'hover-threshold': 'hover-threshold is removed, use `props.hoverThreshold` instead',
        'active-item-change': 'active-item-change is renamed to expand-change'
      });
      const panel = vue.ref(null);
      const input = vue.ref(null);
      const popper = vue.ref(null);
      const suggestionPanel = vue.ref(null);
      const filterHandler = vue.ref(null);
      const filtering = vue.ref(false);
      const pressDeleteCount = vue.ref(0);
      const inputState = vue.reactive({
        hover: false,
        value: null,
        initialHeight: 0
      });
      const checkedState = vue.reactive({
        value: (modelValue === null || modelValue === void 0 ? void 0 : modelValue.value) || null,
        nodes: []
      });
      const elForm = vue.inject('elForm', {});
      const elFormItem = vue.inject('elFormItem', {});
      const isDisabled = vue.computed(() => disabled.value || (elForm === null || elForm === void 0 ? void 0 : elForm.disabled));
      const {
        dropDownVisible,
        toggleDropDownVisible
      } = useDropdownVisible({
        input,
        panel,
        isDisabled,
        emit
      });
      const {
        config,
        multiple,
        leafOnly,
        readonly,
        checkStrictly
      } = useConfig({
        props: realProps,
        attrs,
        filterable
      });
      const {
        presentState,
        computePresentText,
        computePresentContent
      } = usePresent({
        panel,
        checkedState,
        checkStrictly,
        isDisabled,
        leafOnly,
        showAllLevels,
        separator,
        collapseTags,
        multiple
      });
      const {
        suggestions,
        getSuggestions,
        handleSuggestionClick
      } = useSuggestion({
        panel,
        inputState,
        presentState,
        checkedState,
        filterMethod,
        filtering,
        multiple,
        leafOnly,
        showAllLevels,
        separator,
        toggleDropDownVisible
      });
      const {
        realSize,
        tagSize
      } = useSize({
        size,
        elFormItem
      });
      const internalValue = vue.computed({
        get() {
          return multiple !== null && multiple !== void 0 && multiple.value ? presentState.text : inputState.value;
        },

        set(v) {
          multiple !== null && multiple !== void 0 && multiple.value ? presentState.text = v : inputState.value = v;
        }

      });
      const clearBtnVisible = vue.computed(() => {
        if (!clearable.value || isDisabled.value || filtering.value || !inputState.hover) {
          return false;
        }

        return multiple !== null && multiple !== void 0 && multiple.value ? !!checkedState.nodes.filter(node => !node.isDisabled).length : !!presentState.text;
      });

      const handleFocus = e => {
        emit('focus', e);
      };

      const handleBlur = e => {
        emit('blur', e);
      };

      const focusFirstNode = () => {
        vue.nextTick(() => {
          let firstNode = null;

          if (filtering.value && suggestionPanel.value) {
            firstNode = suggestionPanel.value.$el.querySelector('.el-cascader__suggestion-item');
          } else {
            const firstMenu = popper.value.querySelector('.el-cascader-menu');
            firstNode = firstMenu.querySelector('.el-cascader-node[tabindex="-1"]');
          }

          if (firstNode) {
            firstNode.focus();
            !filtering.value && firstNode.click();
          }
        });
      };

      const handleInput = (val, event) => {
        !dropDownVisible.value && toggleDropDownVisible(true);
        if (event && event.isComposing) return;

        if (val) {
          var _filterHandler$value;

          (_filterHandler$value = filterHandler.value) === null || _filterHandler$value === void 0 ? void 0 : _filterHandler$value.call(filterHandler);
        } else {
          filtering.value = false;
        }
      };

      const handleDropdownLeave = () => {
        filtering.value = false;
        inputState.value = presentState.text;
      };

      const handleClear = () => {
        presentState.text = '';
        panel.value.clearCheckedNodes();
      };

      const handleDelete = () => {
        const lastIndex = presentState.tags.length - 1;
        const lastTag = presentState.tags[lastIndex];
        pressDeleteCount.value = inputState.value ? 0 : pressDeleteCount.value++;
        if (!lastTag) return;

        if (pressDeleteCount.value) {
          if (lastTag.hitState) {
            deleteTag(lastIndex);
          } else {
            lastTag.hitState = true;
          }
        }
      };

      const handleExpandChange = value => {
        vue.nextTick(instance.proxy.updatePopper.bind(instance.proxy));
        emit('expand-change', value);
        emit('active-item-change', value);
      };

      const handleKeyDown = event => {
        switch (event.keyCode) {
          case KeyCode.enter:
            toggleDropDownVisible();
            break;

          case KeyCode.down:
            toggleDropDownVisible(true);
            focusFirstNode();
            event.preventDefault();
            break;

          case KeyCode.esc:
          case KeyCode.tab:
            toggleDropDownVisible(false);
            break;
        }
      };

      const handleSuggestionKeyDown = event => {
        const {
          keyCode,
          target
        } = event;
        const prev = target.previousElementSibling;
        const next = target.nextElementSibling;

        switch (keyCode) {
          case KeyCode.enter:
            target.click();
            break;

          case KeyCode.up:
            prev && prev.focus();
            break;

          case KeyCode.down:
            next && next.focus();
            break;

          case KeyCode.esc:
          case KeyCode.tab:
            toggleDropDownVisible(false);
            break;
        }
      };

      const updateStyle = () => {
        const {
          $el
        } = instance.proxy;
        if (!$el) return;
        const inputInner = $el.querySelector('.el-input__inner');
        if (!inputInner) return;
        const tags = $el.querySelector('.el-cascader__tags');
        let suggestionPanelEl = null;

        if (suggestionPanel.value && (suggestionPanelEl = suggestionPanel.value.$el)) {
          const suggestionList = suggestionPanelEl.querySelector('.el-cascader__suggestion-list');
          suggestionList.style.minWidth = inputInner.offsetWidth + 'px';
        }

        if (tags) {
          vue.nextTick(() => {
            const {
              offsetHeight
            } = tags;
            inputInner.style.height = Math.max(offsetHeight + 6, inputState.initialHeight) + 'px';
            instance.proxy.updatePopper();
          });
        }
      };

      const deleteTag = index => {
        const val = checkedState.value[index];
        checkedState.value = checkedState.value.filter((item, i) => i !== index);
        emit('remove-tag', val);
      };

      vue.onMounted(() => {
        var _input$value;

        if (input !== null && input !== void 0 && (_input$value = input.value) !== null && _input$value !== void 0 && _input$value.$el) {
          inputState.initialHeight = input.value.$el.offsetHeight || InputSizeMap[realSize.value] || 40;
        }

        if (!isEmpty(modelValue === null || modelValue === void 0 ? void 0 : modelValue.value)) {
          computePresentContent();
        }

        filterHandler.value = debounce$1(debounceProp, () => {
          if (!inputState.value) {
            filtering.value = false;
            return;
          }

          const before = beforeFilter.value(inputState.value);

          if (before !== null && before !== void 0 && before.then) {
            before.then(getSuggestions);
          } else if (before !== false) {
            getSuggestions();
          } else {
            filtering.value = false;
          }
        });
        addResizeListener(instance.proxy.$el, updateStyle);
      });
      vue.onUnmounted(() => {
        removeResizeListener(instance.proxy.$el, updateStyle);
      });
      vue.watch(disabled, () => {
        computePresentContent();
      });

      if (modelValue) {
        vue.watch(modelValue, val => {
          if (!isEqual(val, checkedState.value)) {
            checkedState.value = val;
            computePresentContent();
          }
        });
      }

      vue.watch(() => checkedState.value, val => {
        if (!isEqual(val, modelValue === null || modelValue === void 0 ? void 0 : modelValue.value) || (modelValue === null || modelValue === void 0 ? void 0 : modelValue.value) === void 0) {
          computePresentContent(); // hide dropdown when single mode

          if (!(multiple !== null && multiple !== void 0 && multiple.value) && !checkStrictly.value && dropDownVisible.value) {
            toggleDropDownVisible(false);
          }

          emit('update:modelValue', val);
          emit('change', val);
          dispatch('ElFormItem', 'el.form.change', [val]);
        }
      });
      vue.watch(options, () => {
        vue.nextTick(computePresentContent);
      }, {
        deep: true
      });
      vue.watch(presentState, value => {
        inputState.value = value.text;

        if (multiple !== null && multiple !== void 0 && multiple.value && (value.tags.length || presentState.tags.length)) {
          vue.nextTick(updateStyle);
        }
      });
      vue.watch(filtering, () => {
        vue.nextTick(instance.proxy.updatePopper);
      });
      return {
        // state
        // ref
        panel,
        input,
        popper,
        suggestionPanel,
        // data
        inputState,
        checkedState,
        presentState,
        suggestions,
        filtering,
        dropDownVisible,
        // computed
        internalValue,
        clearBtnVisible,
        config,
        multiple,
        readonly,
        isDisabled,
        realSize,
        tagSize,
        // methods
        t,
        deleteTag,
        handleFocus,
        handleBlur,
        handleInput,
        handleDropdownLeave,
        handleClear,
        handleDelete,
        handleExpandChange,
        handleKeyDown,
        handleSuggestionKeyDown,
        handleSuggestionClick,
        computePresentText,
        toggleDropDownVisible,

        getCheckedNodes(leafOnly) {
          var _panel$value;

          return panel === null || panel === void 0 ? void 0 : (_panel$value = panel.value) === null || _panel$value === void 0 ? void 0 : _panel$value.getCheckedNodes(leafOnly);
        }

      };
    }

  };

  const useSize = ({
    size,
    elFormItem
  }) => {
    const {
      proxy
    } = vue.getCurrentInstance();
    const realSize = vue.computed(() => {
      var _proxy$$ELEMENT;

      const _elFormItemSize = elFormItem === null || elFormItem === void 0 ? void 0 : elFormItem.elFormItemSize;

      return (size === null || size === void 0 ? void 0 : size.value) || _elFormItemSize || ((_proxy$$ELEMENT = proxy.$ELEMENT) === null || _proxy$$ELEMENT === void 0 ? void 0 : _proxy$$ELEMENT.size);
    });
    const tagSize = vue.computed(() => {
      return ['small', 'mini'].indexOf(realSize.value) > -1 ? 'mini' : 'small';
    });
    return {
      realSize,
      tagSize
    };
  };

  const useConfig = ({
    props,
    attrs,
    filterable
  }) => {
    const config = vue.computed(() => {
      const config = (props === null || props === void 0 ? void 0 : props.value) || {};
      Object.keys(MigratingProps).forEach(oldProp => {
        const {
          newProp,
          type
        } = MigratingProps[oldProp];
        let oldValue = attrs[oldProp] || attrs[kebabCase(oldProp)];

        if (isDef(oldProp) && !isDef(config[newProp])) {
          if (type === Boolean && oldValue === '') {
            oldValue = true;
          }

          config[newProp] = oldValue;
        }
      });
      return config;
    });
    const multiple = vue.computed(() => config.value.multiple);
    const checkStrictly = vue.computed(() => config.value.checkStrictly);
    const leafOnly = vue.computed(() => !checkStrictly.value);
    const readonly = vue.computed(() => !filterable.value || (multiple === null || multiple === void 0 ? void 0 : multiple.value));
    return {
      config,
      checkStrictly,
      multiple,
      leafOnly,
      readonly
    };
  };

  const useDropdownVisible = ({
    input,
    panel,
    isDisabled,
    emit
  }) => {
    const instance = vue.getCurrentInstance();
    const dropDownVisible = vue.ref(false);

    const toggleDropDownVisible = visible => {
      if (isDisabled.value) return;
      visible = isDef(visible) ? visible : !dropDownVisible.value;

      if (visible !== dropDownVisible.value) {
        dropDownVisible.value = visible;

        if (visible) {
          vue.nextTick(() => {
            instance.proxy.updatePopper();
            panel.value.scrollIntoView();
          });
        }

        input === null || input === void 0 ? void 0 : input.value.$refs.input.setAttribute('aria-expanded', visible);
        emit('visible-change', visible);
      }
    };

    return {
      dropDownVisible,
      toggleDropDownVisible
    };
  };

  const useSuggestion = ({
    panel,
    inputState,
    presentState,
    checkedState,
    filterMethod,
    filtering,
    multiple,
    leafOnly,
    showAllLevels,
    separator,
    toggleDropDownVisible
  }) => {
    const instance = vue.getCurrentInstance();
    const suggestions = vue.ref([]);

    const getSuggestions = () => {
      let internalFilterMethod = filterMethod.value;

      if (!(internalFilterMethod instanceof Function)) {
        internalFilterMethod = (node, keyword) => node.text.includes(keyword);
      }

      const internalSuggestions = panel.value.getFlattedNodes(leafOnly.value).filter(node => {
        if (node.isDisabled) return false;
        node.text = node.getText(showAllLevels.value, separator.value) || '';
        return internalFilterMethod(node, inputState.value);
      });

      if (multiple) {
        presentState.tags.forEach(tag => {
          tag.hitState = false;
        });
      } else {
        internalSuggestions.forEach(node => {
          node.checked = isEqual(checkedState.value, node.getValueByOption());
        });
      }

      filtering.value = true;
      suggestions.value = internalSuggestions;
      vue.nextTick(instance.proxy.updatePopper);
    };

    const handleSuggestionClick = index => {
      const targetNode = suggestions.value[index];

      if (multiple !== null && multiple !== void 0 && multiple.value) {
        const {
          checked
        } = targetNode;
        targetNode.doCheck(!checked);
        panel.value.calculateMultiCheckedValue();
      } else {
        checkedState.value = targetNode.getValueByOption();
        toggleDropDownVisible(false);
      }
    };

    return {
      suggestions,
      getSuggestions,
      handleSuggestionClick
    };
  };

  const usePresent = ({
    panel,
    checkedState,
    checkStrictly,
    isDisabled,
    leafOnly,
    showAllLevels,
    separator,
    collapseTags,
    multiple
  }) => {
    const presentState = vue.reactive({
      text: null,
      tags: []
    });

    const computePresentTags = () => {
      const checkedNodes = panel.value.getCheckedNodes(leafOnly.value);
      const tags = [];

      const genTag = node => ({
        node,
        key: node.uid,
        text: node.getText(showAllLevels.value, separator.value),
        hitState: false,
        closable: !isDisabled.value && !node.isDisabled
      });

      if (checkedNodes.length) {
        const [first, ...rest] = checkedNodes;
        const restCount = rest.length;
        tags.push(genTag(first));

        if (restCount) {
          if (collapseTags.value) {
            tags.push({
              key: -1,
              text: `+ ${restCount}`,
              closable: false
            });
          } else {
            rest.forEach(node => tags.push(genTag(node)));
          }
        }
      }

      checkedState.nodes = checkedNodes;
      presentState.tags = tags;
    };

    const computePresentText = () => {
      if (!isEmpty(checkedState.value)) {
        const node = panel.value.getNodeByValue(checkedState.value);

        if (node && (checkStrictly.value || node.isLeaf)) {
          presentState.text = node.getText(showAllLevels.value, separator.value);
          return;
        }
      }

      presentState.text = null;
    };

    const computePresentContent = () => {
      // nextTick is required, because checked nodes may not change right now
      vue.nextTick(() => {
        if (multiple !== null && multiple !== void 0 && multiple.value) {
          computePresentTags();
          presentState.text = presentState.tags.length ? ' ' : null;
        } else {
          computePresentText();
        }
      });
    };

    return {
      presentState,
      computePresentContent,
      computePresentText,
      computePresentTags
    };
  };

  const _hoisted_1$L = {
    key: 0,
    class: "el-cascader__tags"
  };
  const _hoisted_2$u = {
    key: 0,
    class: "el-icon-check"
  };
  const _hoisted_3$o = {
    class: "el-cascader__empty-text"
  };
  function render$12(_ctx, _cache, $props, $setup, $data, $options) {
    const _component_el_input = vue.resolveComponent("el-input");

    const _component_el_tag = vue.resolveComponent("el-tag");

    const _component_el_cascader_panel = vue.resolveComponent("el-cascader-panel");

    const _component_el_scrollbar = vue.resolveComponent("el-scrollbar");

    const _directive_clickoutside = vue.resolveDirective("clickoutside");

    return vue.withDirectives((vue.openBlock(), vue.createBlock("div", {
      ref: "reference",
      class: ['el-cascader', $setup.realSize && `el-cascader--${$setup.realSize}`, {
        'is-disabled': $setup.isDisabled
      }],
      onMouseenter: _cache[10] || (_cache[10] = $event => $setup.inputState.hover = true),
      onMouseleave: _cache[11] || (_cache[11] = $event => $setup.inputState.hover = false),
      onClick: _cache[12] || (_cache[12] = () => $setup.toggleDropDownVisible($setup.readonly ? undefined : true)),
      onKeydown: _cache[13] || (_cache[13] = (...args) => $setup.handleKeyDown && $setup.handleKeyDown(...args))
    }, [vue.createVNode(_component_el_input, {
      ref: "input",
      modelValue: $setup.internalValue,
      "onUpdate:modelValue": _cache[3] || (_cache[3] = $event => $setup.internalValue = $event),
      size: $setup.realSize,
      placeholder: $props.placeholder,
      readonly: $setup.readonly,
      disabled: $setup.isDisabled,
      "validate-event": false,
      class: {
        'is-focus': $setup.dropDownVisible
      },
      onFocus: $setup.handleFocus,
      onBlur: $setup.handleBlur,
      onInput: $setup.handleInput
    }, {
      suffix: vue.withCtx(() => [$setup.clearBtnVisible ? (vue.openBlock(), vue.createBlock("i", {
        key: 0,
        class: "el-input__icon el-icon-circle-close",
        onClick: _cache[1] || (_cache[1] = vue.withModifiers((...args) => $setup.handleClear && $setup.handleClear(...args), ["stop"]))
      })) : (vue.openBlock(), vue.createBlock("i", {
        key: 1,
        class: ['el-input__icon', 'el-icon-arrow-down', $setup.dropDownVisible && 'is-reverse'],
        onClick: _cache[2] || (_cache[2] = vue.withModifiers($event => $setup.toggleDropDownVisible(undefined), ["stop"]))
      }, null, 2
      /* CLASS */
      ))]),
      _: 1
      /* STABLE */

    }, 8
    /* PROPS */
    , ["modelValue", "size", "placeholder", "readonly", "disabled", "class", "onFocus", "onBlur", "onInput"]), $setup.multiple ? (vue.openBlock(), vue.createBlock("div", _hoisted_1$L, [(vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList($setup.presentState.tags, (tag, index) => {
      return vue.openBlock(), vue.createBlock(_component_el_tag, {
        key: tag.key,
        type: "info",
        size: $setup.tagSize,
        hit: tag.hitState,
        closable: tag.closable,
        "disable-transitions": "",
        onClose: $event => $setup.deleteTag(index)
      }, {
        default: vue.withCtx(() => [vue.createVNode("span", null, vue.toDisplayString(tag.text), 1
        /* TEXT */
        )]),
        _: 2
        /* DYNAMIC */

      }, 1032
      /* PROPS, DYNAMIC_SLOTS */
      , ["size", "hit", "closable", "onClose"]);
    }), 128
    /* KEYED_FRAGMENT */
    )), $props.filterable && !$setup.isDisabled ? vue.withDirectives((vue.openBlock(), vue.createBlock("input", {
      key: 0,
      "onUpdate:modelValue": _cache[4] || (_cache[4] = $event => $setup.inputState.value = $event),
      type: "text",
      class: "el-cascader__search-input",
      placeholder: $setup.presentState.tags.length ? '' : $props.placeholder,
      onInput: _cache[5] || (_cache[5] = e => $setup.handleInput($setup.inputState.value, e)),
      onClick: _cache[6] || (_cache[6] = vue.withModifiers($event => $setup.toggleDropDownVisible(true), ["stop"])),
      onKeydown: _cache[7] || (_cache[7] = vue.withKeys((...args) => $setup.handleDelete && $setup.handleDelete(...args), ["delete"]))
    }, null, 40
    /* PROPS, HYDRATE_EVENTS */
    , ["placeholder"])), [[vue.vModelText, $setup.inputState.value, void 0, {
      trim: true
    }]]) : vue.createCommentVNode("v-if", true)])) : vue.createCommentVNode("v-if", true), vue.createVNode(vue.Transition, {
      name: "el-zoom-in-top",
      onAfterLeave: $setup.handleDropdownLeave
    }, {
      default: vue.withCtx(() => [vue.withDirectives(vue.createVNode("div", {
        ref: "popper",
        class: ['el-popper', 'el-cascader__dropdown', $props.popperClass]
      }, [vue.withDirectives(vue.createVNode(_component_el_cascader_panel, {
        ref: "panel",
        modelValue: $setup.checkedState.value,
        "onUpdate:modelValue": _cache[8] || (_cache[8] = $event => $setup.checkedState.value = $event),
        options: $props.options,
        props: $setup.config,
        border: false,
        "render-label": _ctx.$slots.default,
        onExpandChange: $setup.handleExpandChange,
        onClose: _cache[9] || (_cache[9] = $event => $setup.toggleDropDownVisible(false)),
        computePresentText: $setup.computePresentText
      }, null, 8
      /* PROPS */
      , ["modelValue", "options", "props", "render-label", "onExpandChange", "computePresentText"]), [[vue.vShow, !$setup.filtering]]), $props.filterable ? vue.withDirectives((vue.openBlock(), vue.createBlock(_component_el_scrollbar, {
        key: 0,
        ref: "suggestionPanel",
        tag: "ul",
        class: "el-cascader__suggestion-panel",
        "view-class": "el-cascader__suggestion-list",
        onKeydown: $setup.handleSuggestionKeyDown
      }, {
        default: vue.withCtx(() => [$setup.suggestions.length ? (vue.openBlock(true), vue.createBlock(vue.Fragment, {
          key: 0
        }, vue.renderList($setup.suggestions, (item, index) => {
          return vue.openBlock(), vue.createBlock("li", {
            key: item.uid,
            class: ['el-cascader__suggestion-item', item.checked && 'is-checked'],
            tabindex: -1,
            onClick: $event => $setup.handleSuggestionClick(index)
          }, [vue.createVNode("span", null, vue.toDisplayString(item.text), 1
          /* TEXT */
          ), item.checked ? (vue.openBlock(), vue.createBlock("i", _hoisted_2$u)) : vue.createCommentVNode("v-if", true)], 10
          /* CLASS, PROPS */
          , ["onClick"]);
        }), 128
        /* KEYED_FRAGMENT */
        )) : vue.renderSlot(_ctx.$slots, "empty", {
          key: 1
        }, () => [vue.createVNode("li", _hoisted_3$o, vue.toDisplayString($setup.t('el.cascader.noMatch')), 1
        /* TEXT */
        )])]),
        _: 1
        /* STABLE */

      }, 8
      /* PROPS */
      , ["onKeydown"])), [[vue.vShow, $setup.filtering]]) : vue.createCommentVNode("v-if", true)], 2
      /* CLASS */
      ), [[vue.vShow, $setup.dropDownVisible]])]),
      _: 1
      /* STABLE */

    }, 8
    /* PROPS */
    , ["onAfterLeave"])], 34
    /* CLASS, HYDRATE_EVENTS */
    )), [[_directive_clickoutside, () => $setup.toggleDropDownVisible(false)]]);
  }

  script$1b.render = render$12;
  script$1b.__file = "packages/cascader/Cascader.vue";

  /* istanbul ignore next */

  script$1b.install = function (app) {
    app.component(script$1b.name, script$1b);
  };

  var script$1a = {
    props: {
      type: {
        type: String,
        default: ''
      },
      active: {
        type: Boolean,
        default: false
      },
      text: {
        type: String,
        default: ''
      },
      iconClass: {
        type: String,
        default: ''
      }
    },

    setup(props) {
      const classes = useClasses$2(props);
      return {
        classes
      };
    }

  };

  const useClasses$2 = props => {
    return vue.computed(() => {
      return ['el-switch__label', props && props.type ? `el-switch__label--${props && props.type}` : '', {
        'is-active': props && props.active
      }];
    });
  };

  const _hoisted_1$K = {
    key: 0
  };
  function render$11(_ctx, _cache, $props, $setup, $data, $options) {
    return $props.iconClass || $props.text ? (vue.openBlock(), vue.createBlock("span", {
      key: 0,
      class: $setup.classes
    }, [vue.createVNode("i", {
      class: [$props.iconClass]
    }, null, 2
    /* CLASS */
    ), !$props.iconClass ? (vue.openBlock(), vue.createBlock("span", _hoisted_1$K, vue.toDisplayString($props.text), 1
    /* TEXT */
    )) : vue.createCommentVNode("v-if", true)], 2
    /* CLASS */
    )) : vue.createCommentVNode("v-if", true);
  }

  script$1a.render = render$11;
  script$1a.__file = "src/components/Switch/src/SwitchLabel.vue";

  var script$19 = {
    name: 'ElSwitch',
    components: {
      SwitchLabel: script$1a
    },
    props: {
      modelValue: {
        type: [Boolean, String, Number],
        default: false
      },
      activeValue: {
        type: [Boolean, String, Number],
        default: true
      },
      inactiveValue: {
        type: [Boolean, String, Number],
        default: false
      },
      disabled: {
        type: Boolean,
        default: false
      },
      width: {
        type: Number,
        default: 40
      },
      activeText: {
        type: String,
        default: ''
      },
      inactiveText: {
        type: String,
        default: ''
      },
      activeIconClass: {
        type: String,
        default: ''
      },
      inactiveIconClass: {
        type: String,
        default: ''
      },
      activeColor: {
        type: String,
        default: ''
      },
      inactiveColor: {
        type: String,
        default: ''
      }
    },
    emits: ['update:modelValue', 'change'],

    setup(props, {
      emit
    }) {
      const {
        activeValue,
        inactiveValue,
        modelValue,
        disabled,
        activeColor,
        inactiveColor
      } = vue.toRefs(props);
      useNormalizeModelValue({
        modelValue,
        activeValue,
        inactiveValue,
        emit
      });
      const isChecked = vue.computed(() => {
        return modelValue.value === activeValue.value;
      });
      const backgroundColor = vue.computed(() => {
        return isChecked.value ? activeColor.value : inactiveColor.value;
      });
      const {
        handleClick
      } = useClick({
        isChecked,
        inactiveValue,
        activeValue,
        disabled,
        emit
      });
      const classes = useClasses$1({
        disabled,
        isChecked
      });
      const coreStyle = vue.computed(() => {
        const style = {
          width: '',
          background: '',
          'border-color': ''
        };
        style.width = props.width + 'px';
        style.background = backgroundColor.value;
        style['border-color'] = backgroundColor.value;
        return style;
      });
      return {
        isChecked,
        handleClick,
        classes,
        coreStyle
      };
    }

  };

  const useClasses$1 = ({
    disabled,
    isChecked
  }) => {
    return vue.computed(() => {
      return [{
        'is-disabled': disabled.value,
        'is-checked': isChecked.value
      }];
    });
  };

  const useNormalizeModelValue = ({
    modelValue,
    activeValue,
    inactiveValue,
    emit
  }) => {
    vue.onMounted(() => {
      if (modelValue.value !== activeValue.value && modelValue.value !== inactiveValue.value) {
        emit('update:modelValue', inactiveValue.value);
      }
    });
  };

  const useClick = ({
    isChecked,
    inactiveValue,
    activeValue,
    disabled,
    emit
  }) => {
    const handleClick = () => {
      if (disabled && disabled.value) return;
      const newValue = isChecked && isChecked.value ? inactiveValue.value : activeValue.value;
      emit('update:modelValue', newValue);
      emit('change', newValue);
    };

    return {
      handleClick
    };
  };

  function render$10(_ctx, _cache, $props, $setup, $data, $options) {
    const _component_SwitchLabel = vue.resolveComponent("SwitchLabel");

    return vue.openBlock(), vue.createBlock("div", {
      class: ["el-switch", $setup.classes],
      onClick: _cache[1] || (_cache[1] = vue.withModifiers((...args) => $setup.handleClick && $setup.handleClick(...args), ["prevent"]))
    }, [vue.createVNode(_component_SwitchLabel, {
      active: !$setup.isChecked,
      type: "left",
      text: $props.inactiveText,
      iconClass: $props.inactiveIconClass
    }, null, 8
    /* PROPS */
    , ["active", "text", "iconClass"]), vue.createVNode("span", {
      class: "el-switch__core",
      ref: "core",
      style: $setup.coreStyle
    }, null, 4
    /* STYLE */
    ), vue.createVNode(_component_SwitchLabel, {
      active: $setup.isChecked,
      type: "right",
      text: $props.activeText,
      iconClass: $props.activeIconClass
    }, null, 8
    /* PROPS */
    , ["active", "text", "iconClass"])], 2
    /* CLASS */
    );
  }

  script$19.render = render$10;
  script$19.__file = "src/components/Switch/src/Switch.vue";

  /* istanbul ignore next */

  script$19.install = function (app) {
    app.component(script$19.name, script$19);
  };

  const stop = e => e.stopPropagation();
  /**
   * @param {HTMLElement} [reference=$refs.reference] - The reference element used to position the popper.
   * @param {HTMLElement} [popper=$refs.popper] - The HTML element used as popper, or a configuration used to generate the popper.
   * @param {String} [placement=button] - Placement of the popper accepted values: top(-start, -end), right(-start, -end), bottom(-start, -end), left(-start, -end)
   * @param {Number} [offset=0] - Amount of pixels the popper will be shifted (can be negative).
   * @param {Boolean} [visible=false] Visibility of the popup element.
   * @param {Boolean} [visible-arrow=false] Visibility of the arrow, no style.
   */


  const vuePopperProps = {
    transformOrigin: {
      type: [Boolean, String],
      default: true
    },
    placement: {
      type: String,
      default: 'bottom'
    },
    boundariesPadding: {
      type: Number,
      default: 5
    },
    reference: {},
    popper: {},
    offset: {
      default: 0
    },
    modelValue: Boolean,
    visibleArrow: Boolean,
    arrowOffset: {
      type: Number,
      default: 35
    },
    appendToBody: {
      type: Boolean,
      default: true
    },
    popperOptions: {
      type: Object,

      default() {
        return {
          gpuAcceleration: false
        };
      }

    }
  };

  function useVuePopper(props, {
    emit,
    slots,
    referenceEl
  }) {
    const {
      transformOrigin,
      placement,
      reference,
      popper,
      offset,
      modelValue,
      visibleArrow,
      arrowOffset,
      appendToBody,
      popperOptions,
      disabled
    } = vue.toRefs(props);
    const showPopper = vue.ref(false);
    const currentPlacement = vue.ref('');
    const popperElm = vue.ref(null);
    const popperJS = vue.ref(null);
    const instance = vue.getCurrentInstance();

    function createPopper() {
      if (instance.proxy.$isServer) return;
      currentPlacement.value = currentPlacement.value || placement.value;

      if (!/^(top|bottom|left|right)(-start|-end)?$/g.test(currentPlacement.value)) {
        return;
      }

      const options = popperOptions.value;
      const popperRef = popperElm.value = popperElm.value || popper && popper.value || instance.proxy.$refs.popper;
      let referenceRef = referenceEl.value = referenceEl.value || reference && reference.value || instance.proxy.$refs.reference;

      if (!referenceRef && slots.reference && slots.reference() && slots.reference()[0]) {
        referenceRef = referenceEl.value = slots.reference()[0].el;
      }

      if (!popperRef || !referenceRef) return;
      if (visibleArrow.value) appendArrow(popperRef);
      if (appendToBody.value) document.body.appendChild(popperElm.value);

      if (popperJS.value && popperJS.value.destroy) {
        popperJS.value.destroy();
      }

      options.placement = currentPlacement.value;
      options.offset = offset.value;
      options.arrowOffset = arrowOffset.value;
      popperJS.value = new Popper$1(referenceRef, popperRef, options);
      popperJS.value.onCreate(() => {
        emit('created', instance.proxy);
        resetTransformOrigin();
        vue.nextTick(() => updatePopper());
      });

      if (typeof options.onUpdate === 'function') {
        popperJS.value.onUpdate(options.onUpdate);
      }

      popperJS.value._popper.style.zIndex = PopupManager.nextZIndex();
      popperElm.value.addEventListener('click', stop);
    }

    function updatePopper() {
      const popperJSRef = popperJS.value;

      if (popperJSRef) {
        popperJSRef.update();

        if (popperJSRef._popper) {
          popperJSRef._popper.style.zIndex = PopupManager.nextZIndex();
        }
      } else {
        createPopper();
      }
    }

    function doDestroy(forceDestroy) {
      /* istanbul ignore if */
      if (!popperJS.value || showPopper.value && !forceDestroy) return;
      popperJS.value.destroy();
      popperJS.value = null;
    }

    function destroyPopper() {
      if (popperJS.value) {
        resetTransformOrigin();
      }
    }

    function resetTransformOrigin() {
      if (!transformOrigin.value) return;
      const placementMap = {
        top: 'bottom',
        bottom: 'top',
        left: 'right',
        right: 'left'
      };

      const placement = popperJS.value._popper.getAttribute('x-placement').split('-')[0];

      const origin = placementMap[placement];
      popperJS.value._popper.style.transformOrigin = typeof transformOrigin.value === 'string' ? transformOrigin.value : ['top', 'bottom'].indexOf(placement) > -1 ? `center ${origin}` : `${origin} center`;
    }

    const appended = vue.ref(false);

    function appendArrow(element) {
      let hash;

      if (appended.value) {
        return;
      }

      appended.value = true;

      for (const item in element.attributes) {
        if (/^_v-/.test(element.attributes[item].name)) {
          hash = element.attributes[item].name;
          break;
        }
      }

      const arrow = document.createElement('div');

      if (hash) {
        arrow.setAttribute(hash, '');
      }

      arrow.setAttribute('x-arrow', '');
      arrow.className = 'popper__arrow';
      element.appendChild(arrow);
    }

    vue.watch(modelValue, val => {
      showPopper.value = val;
      emit('update:modelValue', val);
    }, {
      immediate: true
    });
    vue.watch(showPopper, val => {
      if (disabled.value) return;
      val ? updatePopper() : destroyPopper();
      emit('update:modelValue', val);
    });
    vue.onBeforeUnmount(() => {
      doDestroy(true);

      if (popperElm.value && popperElm.value.parentNode === document.body) {
        popperElm.value.removeEventListener('click', stop);
        document.body.removeChild(popperElm.value);
      }
    });
    return {
      showPopper,
      currentPlacement,
      popperElm,
      popperJS,
      createPopper,
      updatePopper,
      doDestroy,
      destroyPopper,
      resetTransformOrigin,
      appendArrow
    };
  }

  var ElTooltip = {
    name: 'ElTooltip',
    emits: ['input', 'update:modelValue', 'created'],
    props: { ...vuePopperProps,
      openDelay: {
        type: Number,
        default: 0
      },
      disabled: Boolean,
      manual: Boolean,
      effect: {
        type: String,
        default: 'dark'
      },
      arrowOffset: {
        type: Number,
        default: 0
      },
      popperClass: String,
      content: {
        type: String,
        default: 'dark'
      },
      visibleArrow: {
        default: true
      },
      transition: {
        type: String,
        default: 'el-fade-in-linear'
      },
      popperOptions: {
        default() {
          return {
            boundariesPadding: 10,
            gpuAcceleration: false
          };
        }

      },
      enterable: {
        type: Boolean,
        default: true
      },
      hideAfter: {
        type: Number,
        default: 0
      },
      tabindex: {
        type: Number,
        default: 0
      }
    },

    beforeCreate() {
      if (this.$isServer) return;
      this.popperVM = vue.createApp({
        data() {
          return {
            node: ''
          };
        },

        render() {
          return this.node;
        }

      }).mount(document.createElement('div'));
    },

    setup(props, context) {
      const timeoutPending = vue.ref(null);
      const timeout = vue.ref(null);
      const focusing = vue.ref(false);
      const expectedState = vue.ref(false);
      const referenceElm = vue.ref(null);
      const {
        emit,
        slots
      } = context;
      const {
        modelValue,
        openDelay,
        disabled,
        manual,
        effect,
        popperClass,
        transition,
        enterable,
        hideAfter,
        tabindex
      } = props;
      const {
        showPopper,
        updatePopper,
        doDestroy
      } = useVuePopper(props, {
        emit,
        slots,
        referenceEl: referenceElm
      });
      const instance = vue.getCurrentInstance();
      const tooltipId = `el-tooltip-${generateId()}`;
      const debounceClose = debounce$1(200, () => handleClosePopper());

      const show = () => {
        setExpectedState(true);
        handleShowPopper();
      };

      const hide = () => {
        setExpectedState(false);
        debounceClose();
      };

      const handleFocus = () => {
        focusing.value = true;
        show();
      };

      const handleBlur = () => {
        focusing.value = false;
        hide();
      };

      const removeFocusing = () => {
        focusing.value = false;
      };

      const addTooltipClass = prev => {
        if (!prev) {
          return 'el-tooltip';
        } else {
          return 'el-tooltip ' + prev.replace('el-tooltip', '');
        }
      };

      const handleShowPopper = () => {
        if (!expectedState.value || manual) return;
        clearTimeout(timeout.value);
        timeout.value = setTimeout(() => {
          showPopper.value = true;
        }, openDelay);

        if (hideAfter > 0) {
          timeoutPending.value = setTimeout(() => {
            showPopper.value = false;
          }, hideAfter);
        }
      };

      const handleClosePopper = () => {
        if (enterable && expectedState.value || manual) return;
        clearTimeout(timeout.value);

        if (timeoutPending.value) {
          clearTimeout(timeoutPending.value);
        }

        showPopper.value = false;

        if (disabled) {
          doDestroy();
        }
      };

      const setExpectedState = state => {
        if (state === false) {
          clearTimeout(timeoutPending.value);
        }

        expectedState.value = state;
      };

      const getFirstElement = () => {
        const slotsDefault = slots.default();
        if (!Array.isArray(slotsDefault)) return null;
        let element = null;

        for (let index = 0; index < slotsDefault.length; index++) {
          if (slotsDefault[index] && slotsDefault[index].type) {
            element = slotsDefault[index];
          }
        }

        return element;
      };

      vue.watch(focusing, val => {
        if (val) {
          addClass(referenceElm.value, 'focusing');
        } else {
          removeClass(referenceElm.value, 'focusing');
        }
      });
      vue.onMounted(() => {
        referenceElm.value = instance.proxy.$el;

        if (referenceElm.value.nodeType === 1) {
          referenceElm.value.setAttribute('aria-describedby', tooltipId);
          referenceElm.value.setAttribute('tabindex', tabindex);
          on(referenceElm.value, 'mouseenter', show);
          on(referenceElm.value, 'mouseleave', hide);
          on(referenceElm.value, 'focus', () => {
            if (!slots.default || !slots.default().length) {
              handleFocus();
              return;
            }

            const slotsProps = slots.default()[0].props;

            if (slotsProps && slotsProps.onFocus) {
              slotsProps.onFocus();
            } else {
              handleFocus();
            }
          });
          on(referenceElm.value, 'blur', handleBlur);
          on(referenceElm.value, 'click', removeFocusing);
        } // fix issue https://github.com/ElemeFE/element/issues/14424


        if (modelValue && instance.proxy.popperVM) {
          instance.proxy.popperVM.$nextTick(() => {
            if (modelValue) {
              updatePopper();
            }
          });
        }
      });
      vue.onBeforeMount(() => {
        instance.proxy.updatePopper = updatePopper;
      });
      vue.onUnmounted(() => {
        const reference = referenceElm.value;

        if (reference.nodeType === 1) {
          off(reference, 'mouseenter', show);
          off(reference, 'mouseleave', hide);
          off(reference, 'focus', handleFocus);
          off(reference, 'blur', handleBlur);
          off(reference, 'click', removeFocusing);
        }
      });
      return () => {
        if (instance.proxy.popperVM) {
          instance.proxy.popperVM.node = vue.createVNode(vue.Transition, {
            "name": transition,
            "onAfterLeave": doDestroy
          }, {
            default: () => [vue.withDirectives(vue.createVNode("div", {
              "onMouseleave": () => {
                setExpectedState(false);
                debounceClose();
              },
              "onMouseenter": () => {
                setExpectedState(true);
              },
              "ref": "popper",
              "role": "tooltip",
              "id": tooltipId,
              "aria-hidden": disabled || !showPopper.value ? 'true' : 'false',
              "class": ['el-tooltip__popper', 'is-' + effect, popperClass]
            }, [slots.content ? slots.content() : instance.proxy.content]), [[vue.vShow, !disabled && showPopper.value]])]
          });
        }

        const firstElement = getFirstElement();
        if (!firstElement) return null;
        const firstElementProps = firstElement.props = firstElement.props || {};
        firstElementProps.class = addTooltipClass(firstElementProps.class);
        return firstElement;
      };
    }

  };

  /* istanbul ignore next */

  ElTooltip.install = function (app) {
    app.component(ElTooltip.name, ElTooltip);
  };

  var script$18 = {
    name: 'ElSliderButton',
    components: {
      ElTooltip
    },
    props: {
      modelValue: {
        type: Number,
        default: 0
      },
      vertical: {
        type: Boolean,
        default: false
      },
      tooltipClass: String
    },
    emits: ['update:modelValue'],

    setup(props, {
      emit
    }) {
      const tooltip = vue.ref(null);
      const {
        parent,
        proxy
      } = vue.getCurrentInstance();
      const {
        modelValue,
        vertical
      } = vue.toRefs(props);
      const {
        displayTooltip,
        hideTooltip
      } = useToolTip(proxy);
      const {
        hovering,
        handleMouseEnter,
        handleMouseLeave
      } = useMouseHover(displayTooltip, hideTooltip); // computed

      const {
        disabled,
        max,
        min,
        step,
        showTooltip,
        precision,
        currentPosition,
        enableFormat,
        formatValue,
        wrapperStyle
      } = useComputed(modelValue, vertical);
      const {
        // data
        dragging,
        isClick,
        startX,
        currentX,
        startY,
        currentY,
        startPosition,
        newPosition,
        oldValue,
        // methods
        onButtonDown,
        onDragStart,
        onDragging,
        onDragEnd,
        onLeftKeyDown,
        onRightKeyDown,
        setPosition
      } = useDragAndKeyDown(parent, proxy, emit, modelValue, vertical, disabled, step, max, min, precision, currentPosition, displayTooltip, hideTooltip);
      return {
        // data
        hovering,
        dragging,
        isClick,
        startX,
        currentX,
        startY,
        currentY,
        startPosition,
        newPosition,
        oldValue,
        // computed
        disabled,
        max,
        min,
        step,
        showTooltip,
        precision,
        currentPosition,
        enableFormat,
        formatValue,
        wrapperStyle,
        // methods
        setPosition,
        handleMouseEnter,
        handleMouseLeave,
        onButtonDown,
        onDragStart,
        onDragging,
        onDragEnd,
        onLeftKeyDown,
        onRightKeyDown,
        // ref
        tooltip
      };
    }

  };

  function useToolTip(proxy) {
    function displayTooltip() {
      proxy.tooltip && (proxy.tooltip.showPopper = true);
    }

    function hideTooltip() {
      proxy.tooltip && (proxy.tooltip.showPopper = false);
    }

    return {
      displayTooltip,
      hideTooltip
    };
  }

  function useMouseHover(displayTooltip, hideTooltip) {
    const hovering = vue.ref(false);

    function handleMouseEnter() {
      hovering.value = true;
      displayTooltip();
    }

    function handleMouseLeave() {
      hovering.value = false;
      hideTooltip();
    }

    return {
      hovering,
      handleMouseEnter,
      handleMouseLeave
    };
  }

  function useDragAndKeyDown(parent, proxy, emit, modelValue, vertical, disabled, step, max, min, precision, currentPosition, displayTooltip, hideTooltip) {
    const {
      resetSize,
      emitChange
    } = parent.proxy;
    const dragging = vue.ref(false);
    const isClick = vue.ref(false);
    const startX = vue.ref(0);
    const currentX = vue.ref(0);
    const startY = vue.ref(0);
    const currentY = vue.ref(0);
    const startPosition = vue.ref(0);
    const newPosition = vue.ref(null);
    const oldValue = vue.ref(vue.unref(modelValue)); // watch

    vue.watch(dragging, val => parent.proxy.dragging = val); // eslint-disable-next-line
    //#region drag methods: onButtonDown, onDragStart, onDragging, onDragEnd

    function onButtonDown(event) {
      if (vue.unref(disabled)) return;
      event.preventDefault();
      onDragStart(event);
      window.addEventListener('mousemove', onDragging);
      window.addEventListener('touchmove', onDragging);
      window.addEventListener('mouseup', onDragEnd);
      window.addEventListener('touchend', onDragEnd);
      window.addEventListener('contextmenu', onDragEnd);
    }

    function onDragStart(event) {
      dragging.value = true;
      isClick.value = true;

      if (event.type === 'touchstart') {
        event.clientY = event.touches[0].clientY;
        event.clientX = event.touches[0].clientX;
      }

      if (vue.unref(vertical)) {
        startY.value = event.clientY;
      } else {
        startX.value = event.clientX;
      }

      startPosition.value = parseFloat(vue.unref(currentPosition));
      newPosition.value = vue.unref(startPosition);
    }

    function onDragging(event) {
      if (vue.unref(dragging)) {
        isClick.value = false;
        displayTooltip();
        resetSize();
        let diff = 0;

        if (event.type === 'touchmove') {
          event.clientY = event.touches[0].clientY;
          event.clientX = event.touches[0].clientX;
        }

        if (vue.unref(vertical)) {
          currentY.value = event.clientY;
          diff = (startY.value - currentY.value) / parent.proxy.sliderSize * 100;
        } else {
          currentX.value = event.clientX;
          diff = (currentX.value - startX.value) / parent.proxy.sliderSize * 100;
        }

        newPosition.value = vue.unref(startPosition) + diff;
        setPosition(vue.unref(newPosition));
      }
    }

    function onDragEnd() {
      if (vue.unref(dragging)) {
        /*
         * 防止在 mouseup 后立即触发 click，导致滑块有几率产生一小段位移
         * 不使用 preventDefault 是因为 mouseup 和 click 没有注册在同一个 DOM 上
         */
        setTimeout(() => {
          dragging.value = false;
          hideTooltip();

          if (!isClick.value) {
            setPosition(vue.unref(newPosition));
            emitChange();
          }
        }, 0);
        window.removeEventListener('mousemove', onDragging);
        window.removeEventListener('touchmove', onDragging);
        window.removeEventListener('mouseup', onDragEnd);
        window.removeEventListener('touchend', onDragEnd);
        window.removeEventListener('contextmenu', onDragEnd);
      }
    } // eslint-disable-next-line
    //#endregion
    // eslint-disable-next-line
    //#region KeyDown methods: onLeftKeyDown, onRightKeyDown


    function onLeftKeyDown() {
      if (vue.unref(disabled)) return;
      newPosition.value = parseFloat(vue.unref(currentPosition)) - vue.unref(step) / (vue.unref(max) - vue.unref(min)) * 100;
      setPosition(vue.unref(newPosition));
      emitChange();
    }

    function onRightKeyDown() {
      if (vue.unref(disabled)) return;
      newPosition.value = parseFloat(vue.unref(currentPosition)) + vue.unref(step) / (vue.unref(max) - vue.unref(min)) * 100;
      setPosition(vue.unref(newPosition));
      emitChange();
    } // eslint-disable-next-line
    //#endregion


    function setPosition(newPosition) {
      if (newPosition === null || isNaN(newPosition)) return;

      if (newPosition < 0) {
        newPosition = 0;
      } else if (newPosition > 100) {
        newPosition = 100;
      }

      const lengthPerStep = 100 / ((max.value - min.value) / step.value);
      const steps = Math.round(newPosition / lengthPerStep);
      let value = steps * lengthPerStep * (max.value - min.value) * 0.01 + min.value;
      value = parseFloat(value.toFixed(precision.value));
      emit('update:modelValue', value);
      vue.nextTick(() => {
        //console.log(proxy.tooltip);
        proxy.tooltip && proxy.tooltip.updatePopper();
      });

      if (!vue.unref(dragging) && vue.unref(modelValue) !== vue.unref(oldValue)) {
        oldValue.value = value;
      }
    }

    return {
      dragging,
      isClick,
      startX,
      currentX,
      startY,
      currentY,
      startPosition,
      newPosition,
      oldValue,
      // methods
      setPosition,
      onButtonDown,
      onDragStart,
      onDragging,
      onDragEnd,
      onLeftKeyDown,
      onRightKeyDown
    };
  }

  function useComputed(modelValue, vertical) {
    const {
      parent
    } = vue.getCurrentInstance();
    const disabled = vue.computed(() => parent.proxy.sliderDisabled);
    const max = vue.computed(() => parent.proxy.max);
    const min = vue.computed(() => parent.proxy.min);
    const step = vue.computed(() => parent.proxy.step);
    const showTooltip = vue.computed(() => parent.proxy.showTooltip);
    const precision = vue.computed(() => parent.proxy.precision);
    const currentPosition = vue.computed(() => `${(vue.unref(modelValue) - vue.unref(min)) / (vue.unref(max) - vue.unref(min)) * 100}%`);
    const enableFormat = vue.computed(() => parent.proxy.formatTooltip instanceof Function);
    const formatValue = vue.computed(() => vue.unref(enableFormat) && parent.proxy.formatTooltip(vue.unref(modelValue)) || vue.unref(modelValue));
    const wrapperStyle = vue.computed(() => vue.unref(vertical) ? {
      bottom: vue.unref(currentPosition)
    } : {
      left: vue.unref(currentPosition)
    });
    return {
      disabled,
      max,
      min,
      step,
      showTooltip,
      precision,
      currentPosition,
      enableFormat,
      formatValue,
      wrapperStyle
    };
  }

  function render$$(_ctx, _cache, $props, $setup, $data, $options) {
    const _component_el_tooltip = vue.resolveComponent("el-tooltip");

    return vue.openBlock(), vue.createBlock("div", {
      class: ["el-slider__button-wrapper", {
        hover: $setup.hovering,
        dragging: $setup.dragging
      }],
      onMouseenter: _cache[1] || (_cache[1] = (...args) => $setup.handleMouseEnter && $setup.handleMouseEnter(...args)),
      onMouseleave: _cache[2] || (_cache[2] = (...args) => $setup.handleMouseLeave && $setup.handleMouseLeave(...args)),
      onMousedown: _cache[3] || (_cache[3] = (...args) => $setup.onButtonDown && $setup.onButtonDown(...args)),
      onTouchstartPassive: _cache[4] || (_cache[4] = (...args) => $setup.onButtonDown && $setup.onButtonDown(...args)),
      style: $setup.wrapperStyle,
      ref: "button",
      tabindex: "0",
      onFocus: _cache[5] || (_cache[5] = (...args) => $setup.handleMouseEnter && $setup.handleMouseEnter(...args)),
      onBlur: _cache[6] || (_cache[6] = (...args) => $setup.handleMouseLeave && $setup.handleMouseLeave(...args)),
      onKeydown: [_cache[7] || (_cache[7] = vue.withKeys((...args) => $setup.onLeftKeyDown && $setup.onLeftKeyDown(...args), ["left"])), _cache[8] || (_cache[8] = vue.withKeys((...args) => $setup.onRightKeyDown && $setup.onRightKeyDown(...args), ["right"])), _cache[9] || (_cache[9] = vue.withKeys(vue.withModifiers((...args) => $setup.onLeftKeyDown && $setup.onLeftKeyDown(...args), ["prevent"]), ["down"])), _cache[10] || (_cache[10] = vue.withKeys(vue.withModifiers((...args) => $setup.onRightKeyDown && $setup.onRightKeyDown(...args), ["prevent"]), ["up"]))]
    }, [vue.createVNode(_component_el_tooltip, {
      placement: "top",
      ref: "tooltip",
      "popper-class": $props.tooltipClass,
      disabled: !$setup.showTooltip
    }, {
      content: vue.withCtx(() => [vue.createVNode("span", null, vue.toDisplayString($setup.formatValue), 1
      /* TEXT */
      )]),
      default: vue.withCtx(() => [vue.createVNode("div", {
        class: ["el-slider__button", {
          hover: $setup.hovering,
          dragging: $setup.dragging
        }]
      }, null, 2
      /* CLASS */
      )]),
      _: 1
      /* STABLE */

    }, 8
    /* PROPS */
    , ["popper-class", "disabled"])], 38
    /* CLASS, STYLE, HYDRATE_EVENTS */
    );
  }

  script$18.render = render$$;
  script$18.__file = "packages/slider/src/button.vue";

  var SliderMarker = {
    name: 'ElMarker',
    props: {
      mark: {
        type: [String, Object]
      }
    },

    render() {
      const label = typeof this.mark === 'string' ? this.mark : this.mark.label;
      return vue.createVNode("div", {
        "class": "el-slider__marks-text",
        "style": this.mark.style || {}
      }, [label]);
    }

  };

  var script$17 = {
    name: 'ElSlider',
    props: {
      min: {
        type: Number,
        default: 0
      },
      max: {
        type: Number,
        default: 100
      },
      step: {
        type: Number,
        default: 1
      },
      modelValue: {
        type: [Number, Array],
        default: 0
      },
      showInput: {
        type: Boolean,
        default: false
      },
      showInputControls: {
        type: Boolean,
        default: true
      },
      inputSize: {
        type: String,
        default: 'small'
      },
      showStops: {
        type: Boolean,
        default: false
      },
      showTooltip: {
        type: Boolean,
        default: true
      },
      formatTooltip: Function,
      disabled: {
        type: Boolean,
        default: false
      },
      range: {
        type: Boolean,
        default: false
      },
      vertical: {
        type: Boolean,
        default: false
      },
      height: {
        type: String
      },
      debounce: {
        type: Number,
        default: 300
      },
      label: {
        type: String
      },
      tooltipClass: String,
      marks: Object
    },
    components: {
      ElInputNumber: script$1k,
      SliderButton: script$18,
      SliderMarker
    },
    emits: ['update:modelValue', 'change'],

    setup(props, {
      emit
    }) {
      const {
        proxy
      } = vue.getCurrentInstance(); // data

      const state = vue.reactive({
        firstValue: null,
        secondValue: null,
        oldValue: null,
        dragging: false,
        sliderSize: 1
      });
      const {
        resetSize
      } = useCommon(props, state, proxy);
      useLifeCycle(props, state, proxy, resetSize);
      const {
        minValue,
        maxValue,
        valueChanged,
        setValues
      } = useModel(props, state, emit);
      const {
        stops,
        markList,
        barSize,
        barStart,
        precision,
        runwayStyle,
        barStyle,
        sliderDisabled,
        getStopStyle
      } = useStyle$4(props, state, minValue, maxValue);
      const {
        onSliderClick,
        emitChange,
        setPosition
      } = useEvent$1(props, state, proxy, emit, minValue, maxValue, sliderDisabled, resetSize);
      return { // data
        ...vue.toRefs(state),
        // // computed
        minValue,
        maxValue,
        stops,
        markList,
        barSize,
        barStart,
        precision,
        runwayStyle,
        barStyle,
        sliderDisabled,
        // method
        valueChanged,
        setValues,
        setPosition,
        onSliderClick,
        resetSize,
        emitChange,
        getStopStyle
      };
    }

  };

  function useCommon(props, state, proxy) {
    const {
      vertical
    } = vue.toRefs(props);

    function resetSize() {
      const slider = proxy.$refs.slider;

      if (slider) {
        state.sliderSize = slider[`client${vue.unref(vertical) ? 'Height' : 'Width'}`];
      }
    }

    return {
      resetSize
    };
  }

  function useLifeCycle(props, state, proxy, resetSize) {
    const {
      max,
      min,
      modelValue,
      range,
      label
    } = props;
    let valuetext;

    if (range) {
      if (Array.isArray(modelValue)) {
        state.firstValue = Math.max(min, modelValue[0]);
        state.secondValue = Math.min(max, modelValue[1]);
      } else {
        state.firstValue = min;
        state.secondValue = max;
      }

      state.oldValue = [state.firstValue, state.secondValue];
      valuetext = `${state.firstValue}-${state.secondValue}`;
    } else {
      if (typeof modelValue !== 'number' || isNaN(modelValue)) {
        state.firstValue = min;
      } else {
        state.firstValue = Math.min(max, Math.max(min, modelValue));
      }

      state.oldValue = state.firstValue;
      valuetext = state.firstValue;
    }

    vue.onMounted(() => {
      proxy.$el.setAttribute('aria-valuetext', valuetext); // label screen reader

      proxy.$el.setAttribute('aria-label', // eslint-disable-next-line
      label ? label : `slider between ${min} and ${max}`);
      resetSize();
      window.addEventListener('resize', resetSize);
    });
    vue.onBeforeUnmount(() => window.removeEventListener('resize', resetSize));
  }

  function useModel(props, state, emit) {
    const {
      dispatch
    } = useEmitter();
    const {
      max,
      min,
      modelValue,
      range
    } = vue.toRefs(props);
    const minValue = vue.computed(() => Math.min(state.firstValue, state.secondValue));
    const maxValue = vue.computed(() => Math.max(state.firstValue, state.secondValue)); // watch

    vue.watch(modelValue, (val, oldVal) => {
      if (state.dragging || Array.isArray(val) && Array.isArray(oldVal) && val.every((item, index) => item === oldVal[index])) {
        return;
      }

      setValues();
    });
    vue.watch(() => state.dragging, val => !val && setValues());
    vue.watch(() => state.firstValue, val => vue.unref(range) ? emit('update:modelValue', [vue.unref(minValue), vue.unref(maxValue)]) : emit('update:modelValue', val));
    vue.watch(() => state.secondValue, () => vue.unref(range) && emit('update:modelValue', [vue.unref(minValue), vue.unref(maxValue)]));
    vue.watch(min, () => setValues());
    vue.watch(max, () => setValues());

    function valueChanged() {
      if (vue.unref(range)) {
        return ![minValue, maxValue].every((item, index) => vue.unref(item) === state.oldValue[index]);
      } else {
        return vue.unref(modelValue) !== state.oldValue;
      }
    }

    function setValues() {
      const _max = vue.unref(max);

      const _min = vue.unref(min);

      if (_min > _max) {
        console.error('[Element Error][Slider]min should not be greater than max.');
        return;
      }

      const val = vue.unref(modelValue);

      if (vue.unref(range) && Array.isArray(val)) {
        if (val[1] < _min) {
          emit('update:modelValue', [_min, _min]);
        } else if (val[0] > _max) {
          emit('update:modelValue', [_max, _max]);
        } else if (val[0] < _min) {
          emit('update:modelValue', [_min, val[1]]);
        } else if (val[1] > _max) {
          emit('update:modelValue', [val[0], _max]);
        } else {
          state.firstValue = val[0];
          state.secondValue = val[1];

          if (valueChanged()) {
            dispatch('ElFormItem', 'el.form.change', [vue.unref(minValue), vue.unref(maxValue)]);
            state.oldValue = val.slice();
          }
        }
      } else if (!vue.unref(range) && typeof val === 'number' && !isNaN(val)) {
        if (val < _min) {
          emit('update:modelValue', _min);
        } else if (val > _max) {
          emit('update:modelValue', _max);
        } else {
          state.firstValue = val;

          if (valueChanged()) {
            dispatch('ElFormItem', 'el.form.change', val);
            state.oldValue = val;
          }
        }
      }
    }

    return {
      minValue,
      maxValue,
      valueChanged,
      setValues
    };
  }

  function useEvent$1(props, state, proxy, emit, minValue, maxValue, sliderDisabled, resetSize) {
    // const { emit, proxy, props } = getCurrentInstance()
    const {
      modelValue,
      range,
      vertical,
      min,
      max
    } = vue.toRefs(props);

    function onSliderClick(event) {
      if (vue.unref(sliderDisabled) || state.dragging) return;
      resetSize();
      const slider = proxy.$refs.slider;

      if (vue.unref(vertical)) {
        const sliderOffsetBottom = slider.getBoundingClientRect().bottom;
        setPosition((sliderOffsetBottom - event.clientY) / state.sliderSize * 100);
      } else {
        const sliderOffsetLeft = slider.getBoundingClientRect().left;
        setPosition((event.clientX - sliderOffsetLeft) / state.sliderSize * 100);
      }

      emitChange();
    }

    function emitChange() {
      vue.nextTick(() => emit('change', vue.unref(range) ? [vue.unref(minValue), vue.unref(maxValue)] : vue.unref(modelValue)));
    }

    function setPosition(percent) {
      const targetValue = vue.unref(min) + percent * (vue.unref(max) - vue.unref(min)) / 100;

      if (!vue.unref(range)) {
        proxy.$refs.button1.setPosition(percent);
        return;
      }

      let button;

      if (Math.abs(vue.unref(minValue) - targetValue) < Math.abs(vue.unref(maxValue) - targetValue)) {
        button = state.firstValue < state.secondValue ? 'button1' : 'button2';
      } else {
        button = state.firstValue > state.secondValue ? 'button1' : 'button2';
      }

      proxy.$refs[button].setPosition(percent);
    }

    return {
      onSliderClick,
      emitChange,
      setPosition
    };
  }

  function useStyle$4(props, state, minValue, maxValue) {
    const elForm = vue.inject('elFrom', {
      default: ''
    });
    const {
      disabled,
      height,
      showStops,
      min,
      max,
      step,
      range,
      marks,
      vertical
    } = vue.toRefs(props);
    const stops = vue.computed(() => {
      if (!vue.unref(showStops) || vue.unref(min) > vue.unref(max)) return [];

      if (vue.unref(step) === 0) {
        console.warn('[Element Warn][Slider]step should not be 0.');
        return [];
      }

      const stopCount = (vue.unref(max) - vue.unref(min)) / vue.unref(step);
      const stepWidth = 100 * vue.unref(step) / (vue.unref(max) - vue.unref(min));
      const result = [];

      for (let i = 1; i < stopCount; i++) {
        result.push(i * stepWidth);
      }

      if (vue.unref(range)) {
        return result.filter(step => {
          return step < 100 * (vue.unref(minValue) - vue.unref(min)) / (vue.unref(max) - vue.unref(min)) || step > 100 * (vue.unref(maxValue) - vue.unref(min)) / (vue.unref(max) - vue.unref(min));
        });
      } else {
        return result.filter(step => step > 100 * (state.firstValue - vue.unref(min)) / (vue.unref(max) - vue.unref(min)));
      }
    });
    const markList = vue.computed(() => {
      if (!vue.unref(marks)) {
        return [];
      }

      const marksKeys = Object.keys(vue.unref(marks));
      return marksKeys.map(parseFloat).sort((a, b) => a - b).filter(point => point <= vue.unref(max) && point >= vue.unref(min)).map(point => ({
        point,
        position: (point - vue.unref(min)) * 100 / (vue.unref(max) - vue.unref(min)),
        mark: marks.value[point]
      }));
    });
    const barSize = vue.computed(() => {
      return vue.unref(range) ? `${100 * (vue.unref(maxValue) - vue.unref(minValue)) / (vue.unref(max) - vue.unref(min))}%` : `${100 * (state.firstValue - vue.unref(min)) / (vue.unref(max) - vue.unref(min))}%`;
    });
    const barStart = vue.computed(() => {
      return vue.unref(range) ? `${100 * (vue.unref(minValue) - vue.unref(min)) / (vue.unref(max) - vue.unref(min))}%` : '0%';
    });
    const precision = vue.computed(() => {
      const precisions = [min, max, step].map(item => {
        const decimal = ('' + vue.unref(item)).split('.')[1];
        return decimal ? decimal.length : 0;
      });
      return Math.max.apply(null, precisions);
    });
    const runwayStyle = vue.computed(() => {
      if (vue.unref(vertical) && isUndefined(height)) {
        console.warn('[Element Warn][Slider]height must has a value when vertical is true');
        return {};
      }

      return vue.unref(vertical) ? {
        height: vue.unref(height)
      } : {};
    });
    const barStyle = vue.computed(() => {
      return vue.unref(vertical) ? {
        height: vue.unref(barSize),
        bottom: vue.unref(barStart)
      } : {
        width: vue.unref(barSize),
        left: vue.unref(barStart)
      };
    });
    const sliderDisabled = vue.computed(() => {
      return vue.unref(disabled) || (elForm.props || {}).disabled;
    });

    function getStopStyle(position) {
      return vue.unref(vertical) ? {
        bottom: position + '%'
      } : {
        left: position + '%'
      };
    }

    return {
      stops,
      markList,
      barSize,
      barStart,
      precision,
      runwayStyle,
      barStyle,
      sliderDisabled,
      getStopStyle
    };
  }

  const _hoisted_1$J = {
    class: "el-slider__marks"
  };
  function render$_(_ctx, _cache, $props, $setup, $data, $options) {
    const _component_el_input_number = vue.resolveComponent("el-input-number");

    const _component_slider_button = vue.resolveComponent("slider-button");

    const _component_slider_marker = vue.resolveComponent("slider-marker");

    return vue.openBlock(), vue.createBlock("div", {
      class: ["el-slider", {
        'is-vertical': $props.vertical,
        'el-slider--with-input': $props.showInput
      }],
      role: "slider",
      "aria-valuemin": $props.min,
      "aria-valuemax": $props.max,
      "aria-orientation": $props.vertical ? 'vertical' : 'horizontal',
      "aria-disabled": $setup.sliderDisabled
    }, [$props.showInput && !$props.range ? (vue.openBlock(), vue.createBlock(_component_el_input_number, {
      key: 0,
      modelValue: _ctx.firstValue,
      "onUpdate:modelValue": _cache[1] || (_cache[1] = $event => _ctx.firstValue = $event),
      class: "el-slider__input",
      ref: "input",
      onChange: $setup.emitChange,
      step: $props.step,
      disabled: $setup.sliderDisabled,
      controls: $props.showInputControls,
      min: $props.min,
      max: $props.max,
      debounce: $props.debounce,
      size: $props.inputSize
    }, null, 8
    /* PROPS */
    , ["modelValue", "onChange", "step", "disabled", "controls", "min", "max", "debounce", "size"])) : vue.createCommentVNode("v-if", true), vue.createVNode("div", {
      class: ["el-slider__runway", {
        'show-input': $props.showInput,
        disabled: $setup.sliderDisabled
      }],
      style: $setup.runwayStyle,
      onClick: _cache[4] || (_cache[4] = (...args) => $setup.onSliderClick && $setup.onSliderClick(...args)),
      ref: "slider"
    }, [vue.createVNode("div", {
      class: "el-slider__bar",
      style: $setup.barStyle
    }, null, 4
    /* STYLE */
    ), vue.createVNode(_component_slider_button, {
      modelValue: _ctx.firstValue,
      "onUpdate:modelValue": _cache[2] || (_cache[2] = $event => _ctx.firstValue = $event),
      vertical: $props.vertical,
      "tooltip-class": $props.tooltipClass,
      ref: "button1"
    }, null, 8
    /* PROPS */
    , ["modelValue", "vertical", "tooltip-class"]), $props.range ? (vue.openBlock(), vue.createBlock(_component_slider_button, {
      key: 0,
      vertical: $props.vertical,
      modelValue: _ctx.secondValue,
      "onUpdate:modelValue": _cache[3] || (_cache[3] = $event => _ctx.secondValue = $event),
      "tooltip-class": $props.tooltipClass,
      ref: "button2"
    }, null, 8
    /* PROPS */
    , ["vertical", "modelValue", "tooltip-class"])) : vue.createCommentVNode("v-if", true), $props.showStops ? (vue.openBlock(true), vue.createBlock(vue.Fragment, {
      key: 1
    }, vue.renderList($setup.stops, (item, key) => {
      return vue.openBlock(), vue.createBlock("div", {
        class: "el-slider__stop",
        key: key,
        style: $setup.getStopStyle(item)
      }, null, 4
      /* STYLE */
      );
    }), 128
    /* KEYED_FRAGMENT */
    )) : vue.createCommentVNode("v-if", true), $setup.markList.length > 0 ? (vue.openBlock(), vue.createBlock(vue.Fragment, {
      key: 2
    }, [vue.createVNode("div", null, [(vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList($setup.markList, (item, key) => {
      return vue.openBlock(), vue.createBlock("div", {
        style: $setup.getStopStyle(item.position),
        class: "el-slider__stop el-slider__marks-stop",
        key: key
      }, null, 4
      /* STYLE */
      );
    }), 128
    /* KEYED_FRAGMENT */
    ))]), vue.createVNode("div", _hoisted_1$J, [(vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList($setup.markList, (item, key) => {
      return vue.openBlock(), vue.createBlock(_component_slider_marker, {
        mark: item.mark,
        key: key,
        style: $setup.getStopStyle(item.position)
      }, null, 8
      /* PROPS */
      , ["mark", "style"]);
    }), 128
    /* KEYED_FRAGMENT */
    ))])], 64
    /* STABLE_FRAGMENT */
    )) : vue.createCommentVNode("v-if", true)], 6
    /* CLASS, STYLE */
    )], 10
    /* CLASS, PROPS */
    , ["aria-valuemin", "aria-valuemax", "aria-orientation", "aria-disabled"]);
  }

  script$17.render = render$_;
  script$17.__file = "packages/slider/Slider.vue";

  /* istanbul ignore next */

  script$17.install = function (app) {
    app.component(script$17.name, script$17);
  };

  const DEFAULT_COLOR = '#409EFF';
  const STATUS_SETTING = {
      success: {
          color: '#67c23a',
          lineIconClass: 'el-icon-circle-check',
          arcIconClass: 'el-icon-check'
      },
      warning: {
          color: '#e6a23c',
          lineIconClass: 'el-icon-warning',
          arcIconClass: 'el-icon-warning'
      },
      exception: {
          color: '#f56c6c',
          lineIconClass: 'el-icon-circle-close',
          arcIconClass: 'el-icon-close'
      }
  };
  const STATUSES = Object.keys(STATUS_SETTING);
  const TYPES = ['line', 'circle', 'dashboard'];
  const LINECAPS = ['butt', 'round', 'square'];
  const statusValid = (val) => isEmpty(val) || (!isEmpty(val) && STATUSES.includes(val));
  const percentageValid = (val) => isNumber(val) && val >= 0 && val <= 100;
  const typeValid = (val) => TYPES.includes(val);
  const linecapValid = (val) => LINECAPS.includes(val);
  const FULL_PERCENT = 100;
  const DEFAULT_SVG_PX = 126;
  const DEFAULT_STROKE_PX = 6;
  const SVG_MAX_SIZE = 100;
  const SVG_VIEW_BOX = generateViewBox(SVG_MAX_SIZE);
  const DEFAULT_FIXED = 1;
  const DASHBOARD_RATE = 0.75;
  const TRANSITION = 'stroke-dasharray 0.6s ease 0s, stroke 0.6s ease 0s';
  const props$2 = {
      type: {
          type: String,
          default: 'line',
          validator: typeValid
      },
      percentage: {
          type: Number,
          default: 0,
          required: true,
          validator: percentageValid
      },
      format: {
          type: Function
      },
      status: {
          type: String,
          default: '',
          required: false,
          validator: statusValid
      },
      color: {
          type: [String, Function, Array],
          default: ''
      },
      showText: {
          type: Boolean,
          default: true
      },
      strokeWidth: {
          type: Number,
          default: DEFAULT_STROKE_PX
      },
      textInside: {
          type: Boolean,
          default: false
      },
      width: {
          type: Number,
          default: DEFAULT_SVG_PX
      },
      strokeLinecap: {
          type: String,
          default: 'round',
          validator: linecapValid
      }
  };
  function getColorsIndex(colors, percent) {
      const i = colors.findIndex((c) => percent < c.percentage);
      return i < 0 ? colors.length - 1 : i;
  }
  function sortByPercentage(pre, next) {
      return pre.percentage - next.percentage;
  }
  function toPercentageColors(colors) {
      const span = FULL_PERCENT / colors.length;
      return colors.map((color, i) => {
          if (isString(color)) {
              return { color, percentage: span * (i + 1) };
          }
          return color;
      });
  }
  function autoFixPercentage(percentage) {
      if (percentage < 0) {
          return 0;
      }
      if (percentage > FULL_PERCENT) {
          return FULL_PERCENT;
      }
      return percentage;
  }
  function generateViewBox(size) {
      return `0 0 ${size} ${size}`;
  }
  function generateSvgPathD(strokeWidth, type) {
      const half = SVG_MAX_SIZE / 2;
      const radius = calcSvgRadius(strokeWidth);
      const diameter = radius * 2;
      const isDashboard = type === 'dashboard';
      const fromTo = isDashboard ? '' : '-';
      const toFrom = isDashboard ? '-' : '';
      const d = `M ${half} ${half} m 0 ${fromTo}${radius} a ${radius} ${radius} 0 1 1 0 ${toFrom}${diameter} a ${radius} ${radius} 0 1 1 0 ${fromTo}${diameter}`;
      return d;
  }
  function genFnToRelativeSvgSize(width) {
      return (size) => {
          return (size / width) * SVG_MAX_SIZE;
      };
  }
  function toFixedStr(f) {
      return f.toFixed(DEFAULT_FIXED);
  }
  function calcRelativeSvgSize(size, width) {
      return Number.parseFloat(toFixedStr(genFnToRelativeSvgSize(width)(size)));
  }
  function calcSvgRadius(strokeWidth) {
      return SVG_MAX_SIZE / 2 - strokeWidth / 2;
  }
  function calcPerimeter(radius) {
      return 2 * Math.PI * radius;
  }
  function genTrailPathStyle(perimeter, type = 'circle') {
      const rate = getRate(type);
      const offset = toFixedStr(getOffset(perimeter, rate));
      const range = toFixedStr(perimeter * rate);
      const all = toFixedStr(perimeter);
      const strokeDasharray = `${range}px, ${all}px`;
      const strokeDashoffset = `${offset}px`;
      return { strokeDasharray, strokeDashoffset };
  }
  function getRate(type) {
      return type === 'dashboard' ? DASHBOARD_RATE : 1;
  }
  function genArcPathStyle(perimeter, percentage = 0, type = 'circle') {
      const rate = getRate(type);
      const offset = toFixedStr(getOffset(perimeter, rate));
      const p = toFixedStr(perimeter * (percentage / FULL_PERCENT) * rate);
      const s = toFixedStr(perimeter);
      const strokeDasharray = `${p}px, ${s}px`;
      const strokeDashoffset = `${offset}px`;
      const transition = TRANSITION;
      return { strokeDasharray, strokeDashoffset, transition };
  }
  function getSvgStrokeColor(status, color, percentage) {
      if (!isEmpty(color)) {
          return getColorBy(color, percentage);
      }
      if (!isEmpty(status)) {
          return STATUS_SETTING[status].color;
      }
      return DEFAULT_COLOR;
  }
  function getOffset(perimeter, rate) {
      return (-1 * perimeter * (1 - rate)) / 2;
  }
  function getColorBy(color, percentage) {
      if (isArray(color)) {
          const colors = color;
          const cs = toPercentageColors(colors).sort(sortByPercentage);
          const i = getColorsIndex(cs, percentage);
          return cs[i].color;
      }
      if (isFunction$1(color)) {
          const fnColor = color;
          return fnColor(percentage);
      }
      if (isString(color)) {
          return color;
      }
  }

  var script$16 = vue.defineComponent({
    name: 'ElProgress',
    props: props$2,

    setup(props) {
      const {
        percentage,
        format,
        color,
        strokeWidth,
        type,
        status,
        showText,
        textInside,
        width
      } = vue.toRefs(props);
      const barStyle = useBarStyle(percentage, color);
      const barOuterStyle = useBarOuterStyle(strokeWidth);
      const content = useContent(format, percentage);
      const iconClass = useIconClass(status, type);
      const rootClass = useRootClass(type, status, showText, textInside);
      const circleStyle = useCircleStyle(width);
      const viewBox = SVG_VIEW_BOX;
      const svgStrokeWidth = useSvgStrokeWidth(strokeWidth, width);
      const svgPathD = useSvgPathD(svgStrokeWidth, type);
      const trailPathStyle = useTrailPathStyle(svgStrokeWidth, type);
      const arcPathStyle = useArcPathStyle(svgStrokeWidth, percentage, type);
      const svgStrokeColor = useSvgStrokeColor(status, color, percentage);
      const textStyle = useTextStyle(type, width);
      return {
        barStyle,
        barOuterStyle,
        content,
        iconClass,
        rootClass,
        circleStyle,
        viewBox,
        svgPathD,
        svgStrokeWidth,
        trailPathStyle,
        arcPathStyle,
        svgStrokeColor,
        textStyle
      };
    }

  });

  const useRootClass = (type, status, showText, textInside) => {
    return vue.computed(() => {
      const valType = vue.unref(type);
      const valStatus = vue.unref(status);
      const valShowText = vue.unref(showText);
      const valTextInside = vue.unref(textInside);
      const statusClass = valStatus && statusValid(valStatus) ? `is-${valStatus}` : '';
      return ['el-progress', `el-progress--${valType}`, statusClass, {
        'el-progress--without-text': !valShowText,
        'el-progress--text-inside': valTextInside
      }];
    });
  };

  const useBarStyle = (percentage, color) => {
    return vue.computed(() => {
      const pv = autoFixPercentage(vue.unref(percentage));
      const cv = vue.unref(color);
      const backgroundColor = getColorBy(cv, pv);
      return {
        width: `${pv}%`,
        backgroundColor
      };
    });
  };

  const useBarOuterStyle = strokeWidth => {
    return vue.computed(() => {
      const sw = vue.unref(strokeWidth);
      return {
        height: sw + 'px'
      };
    });
  };

  const useContent = (format, percentage) => {
    return vue.computed(() => {
      const fv = vue.unref(format);
      const pv = autoFixPercentage(vue.unref(percentage));

      if (format) {
        return fv(pv) || '';
      }

      return `${pv}%`;
    });
  };

  const useIconClass = (status, type) => {
    return vue.computed(() => {
      const st = vue.unref(status);
      const t = vue.unref(type) === 'line' ? 'lineIconClass' : 'arcIconClass';
      const stat = STATUS_SETTING[st];
      return stat && stat[t] || '';
    });
  };

  const useCircleStyle = width => {
    return vue.computed(() => {
      const val = vue.unref(width) + 'px';
      return {
        width: val,
        height: val
      };
    });
  };

  const useSvgStrokeWidth = (strokeWidth, width) => {
    return vue.computed(() => {
      const sw = vue.unref(strokeWidth);
      const w = vue.unref(width);
      return calcRelativeSvgSize(sw, w);
    });
  };

  const useSvgPathD = (svgStrokeWidth, type) => {
    return vue.computed(() => {
      const ssw = vue.unref(svgStrokeWidth);
      const tv = vue.unref(type);
      return generateSvgPathD(ssw, tv);
    });
  };

  const useTrailPathStyle = (svgStrokeWidth, type) => {
    return vue.computed(() => {
      const ssw = vue.unref(svgStrokeWidth);
      const radius = calcSvgRadius(ssw);
      const perimeter = calcPerimeter(radius);
      const tv = vue.unref(type);
      return genTrailPathStyle(perimeter, tv);
    });
  };

  const useArcPathStyle = (svgStrokeWidth, percentage, type) => {
    return vue.computed(() => {
      const ssw = vue.unref(svgStrokeWidth);
      const radius = calcSvgRadius(ssw);
      const perimeter = calcPerimeter(radius);
      const percent = autoFixPercentage(vue.unref(percentage));
      const tv = vue.unref(type);
      return genArcPathStyle(perimeter, percent, tv);
    });
  };

  const useSvgStrokeColor = (status, color, percentage) => {
    return vue.computed(() => {
      const s = vue.unref(status);
      const c = vue.unref(color);
      const p = autoFixPercentage(vue.unref(percentage));
      return getSvgStrokeColor(s, c, p);
    });
  };
  /**
   * Only change when type is not 'line'
   */


  const useTextStyle = (type, width) => {
    return vue.computed(() => {
      const t = vue.unref(type);
      const w = vue.unref(width);
      const fontSize = (w * 0.11 + 2).toFixed() + 'px';
      return t === 'line' ? '' : {
        fontSize
      };
    });
  };

  const _hoisted_1$I = {
    key: 0,
    class: "el-progress-bar"
  };
  const _hoisted_2$t = {
    key: 0,
    class: "el-progress-bar__innerText"
  };
  function render$Z(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("div", {
      class: _ctx.rootClass
    }, [_ctx.type === 'line' ? (vue.openBlock(), vue.createBlock("div", _hoisted_1$I, [vue.createVNode("div", {
      class: "el-progress-bar__outer",
      style: _ctx.barOuterStyle
    }, [vue.createVNode("div", {
      class: "el-progress-bar__inner",
      style: _ctx.barStyle
    }, [_ctx.showText && _ctx.textInside ? (vue.openBlock(), vue.createBlock("div", _hoisted_2$t, vue.toDisplayString(_ctx.content), 1
    /* TEXT */
    )) : vue.createCommentVNode("v-if", true)], 4
    /* STYLE */
    )], 4
    /* STYLE */
    )])) : (vue.openBlock(), vue.createBlock("div", {
      key: 1,
      class: "el-progress-circle",
      style: _ctx.circleStyle
    }, [(vue.openBlock(), vue.createBlock("svg", {
      viewBox: _ctx.viewBox
    }, [vue.createVNode("path", {
      class: "el-progress-circle__track",
      stroke: "#e5e9f2",
      "stroke-width": _ctx.svgStrokeWidth,
      fill: "none",
      d: _ctx.svgPathD,
      style: _ctx.trailPathStyle
    }, null, 12
    /* STYLE, PROPS */
    , ["stroke-width", "d"]), vue.createVNode("path", {
      class: "el-progress-circle__path",
      stroke: _ctx.svgStrokeColor,
      "stroke-width": _ctx.svgStrokeWidth,
      "stroke-linecap": _ctx.strokeLinecap,
      fill: "none",
      d: _ctx.svgPathD,
      style: _ctx.arcPathStyle
    }, null, 12
    /* STYLE, PROPS */
    , ["stroke", "stroke-width", "stroke-linecap", "d"])], 8
    /* PROPS */
    , ["viewBox"]))], 4
    /* STYLE */
    )), _ctx.showText && !_ctx.textInside ? (vue.openBlock(), vue.createBlock("div", {
      key: 2,
      class: "el-progress__text",
      style: _ctx.textStyle
    }, [!_ctx.status ? (vue.openBlock(), vue.createBlock(vue.Fragment, {
      key: 0
    }, [vue.createTextVNode(vue.toDisplayString(_ctx.content), 1
    /* TEXT */
    )], 64
    /* STABLE_FRAGMENT */
    )) : (vue.openBlock(), vue.createBlock("i", {
      key: 1,
      class: _ctx.iconClass
    }, null, 2
    /* CLASS */
    ))], 4
    /* STYLE */
    )) : vue.createCommentVNode("v-if", true)], 2
    /* CLASS */
    );
  }

  script$16.render = render$Z;
  script$16.__file = "src/components/Progress/src/Progress.vue";

  script$16.install = function (app) {
    app.component(script$16.name, script$16);
  };

  var script$15 = {
    name: 'ElUploadList',
    mixins: [Locale],
    components: {
      ElProgress: script$16
    },
    emits: ['remove'],
    props: {
      files: {
        type: Array,

        default() {
          return [];
        }

      },
      disabled: {
        type: Boolean,
        default: false
      },
      handlePreview: Function,
      listType: String
    },

    setup(props, {
      emit
    }) {
      const focusing = vue.ref(false);

      const parsePercentage = val => {
        return parseInt(val, 10);
      };

      const handleClick = file => {
        props.handlePreview && props.handlePreview(file);
      };

      return {
        focusing,
        parsePercentage,
        handleClick,
        emit
      };
    }

  };

  const _hoisted_1$H = /*#__PURE__*/vue.createVNode("i", {
    class: "el-icon-document"
  }, null, -1
  /* HOISTED */
  );

  const _hoisted_2$s = {
    class: "el-upload-list__item-status-label"
  };
  const _hoisted_3$n = {
    key: 2,
    class: "el-icon-close-tip"
  };
  const _hoisted_4$e = {
    key: 4,
    class: "el-upload-list__item-actions"
  };

  const _hoisted_5$a = /*#__PURE__*/vue.createVNode("i", {
    class: "el-icon-zoom-in"
  }, null, -1
  /* HOISTED */
  );

  const _hoisted_6$6 = /*#__PURE__*/vue.createVNode("i", {
    class: "el-icon-delete"
  }, null, -1
  /* HOISTED */
  );

  function render$Y(_ctx, _cache, $props, $setup, $data, $options) {
    const _component_el_progress = vue.resolveComponent("el-progress");

    return vue.openBlock(), vue.createBlock(vue.TransitionGroup, {
      tag: "ul",
      class: ['el-upload-list', 'el-upload-list--' + $props.listType, {
        'is-disabled': $props.disabled
      }],
      name: "el-list"
    }, {
      default: vue.withCtx(() => [(vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList($props.files, file => {
        return vue.openBlock(), vue.createBlock("li", {
          class: ['el-upload-list__item', 'is-' + file.status, $setup.focusing ? 'focusing' : ''],
          key: file.uid,
          tabindex: "0",
          onKeydown: vue.withKeys($event => !$props.disabled && _ctx.$emit('remove', file), ["delete"]),
          onFocus: _cache[1] || (_cache[1] = $event => $setup.focusing = true),
          onBlur: _cache[2] || (_cache[2] = $event => $setup.focusing = false),
          onClick: _cache[3] || (_cache[3] = $event => $setup.focusing = false)
        }, [vue.renderSlot(_ctx.$slots, "default", {
          file: file
        }, () => [file.status !== 'uploading' && ['picture-card', 'picture'].indexOf($props.listType) > -1 ? (vue.openBlock(), vue.createBlock("img", {
          key: 0,
          class: "el-upload-list__item-thumbnail",
          src: file.url,
          alt: ""
        }, null, 8
        /* PROPS */
        , ["src"])) : vue.createCommentVNode("v-if", true), vue.createVNode("a", {
          class: "el-upload-list__item-name",
          onClick: $event => $setup.handleClick(file)
        }, [_hoisted_1$H, vue.createTextVNode(vue.toDisplayString(file.name), 1
        /* TEXT */
        )], 8
        /* PROPS */
        , ["onClick"]), vue.createVNode("label", _hoisted_2$s, [vue.createVNode("i", {
          class: {
            'el-icon-upload-success': true,
            'el-icon-circle-check': $props.listType === 'text',
            'el-icon-check': ['picture-card', 'picture'].indexOf($props.listType) > -1
          }
        }, null, 2
        /* CLASS */
        )]), !$props.disabled ? (vue.openBlock(), vue.createBlock("i", {
          key: 1,
          class: "el-icon-close",
          onClick: $event => _ctx.$emit('remove', file)
        }, null, 8
        /* PROPS */
        , ["onClick"])) : vue.createCommentVNode("v-if", true), !$props.disabled ? (vue.openBlock(), vue.createBlock("i", _hoisted_3$n, vue.toDisplayString(_ctx.t('el.upload.deleteTip')), 1
        /* TEXT */
        )) : vue.createCommentVNode("v-if", true), vue.createCommentVNode("因为close按钮只在li:focus的时候 display, li blur后就不存在了，所以键盘导航时永远无法 focus到 close按钮上"), file.status === 'uploading' ? (vue.openBlock(), vue.createBlock(_component_el_progress, {
          key: 3,
          type: $props.listType === 'picture-card' ? 'circle' : 'line',
          "stroke-width": $props.listType === 'picture-card' ? 6 : 2,
          percentage: $setup.parsePercentage(file.percentage)
        }, null, 8
        /* PROPS */
        , ["type", "stroke-width", "percentage"])) : vue.createCommentVNode("v-if", true), $props.listType === 'picture-card' ? (vue.openBlock(), vue.createBlock("span", _hoisted_4$e, [$props.handlePreview && $props.listType === 'picture-card' ? (vue.openBlock(), vue.createBlock("span", {
          key: 0,
          class: "el-upload-list__item-preview",
          onClick: $event => $props.handlePreview(file)
        }, [_hoisted_5$a], 8
        /* PROPS */
        , ["onClick"])) : vue.createCommentVNode("v-if", true), !$props.disabled ? (vue.openBlock(), vue.createBlock("span", {
          key: 1,
          class: "el-upload-list__item-delete",
          onClick: $event => _ctx.$emit('remove', file)
        }, [_hoisted_6$6], 8
        /* PROPS */
        , ["onClick"])) : vue.createCommentVNode("v-if", true)])) : vue.createCommentVNode("v-if", true)])], 42
        /* CLASS, PROPS, HYDRATE_EVENTS */
        , ["onKeydown"]);
      }), 128
      /* KEYED_FRAGMENT */
      ))]),
      _: 1
      /* STABLE */

    }, 8
    /* PROPS */
    , ["class"]);
  }

  script$15.render = render$Y;
  script$15.__file = "packages/upload/src/upload-list.vue";

  function getError(action, option, xhr) {
    let msg;

    if (xhr.response) {
      msg = `${xhr.response.error || xhr.response}`;
    } else if (xhr.responseText) {
      msg = `${xhr.responseText}`;
    } else {
      msg = `fail to post ${action} ${xhr.status}`;
    }

    const err = new Error(msg);
    err.status = xhr.status;
    err.method = 'post';
    err.url = action;
    return err;
  }

  function getBody(xhr) {
    const text = xhr.responseText || xhr.response;

    if (!text) {
      return text;
    }

    try {
      return JSON.parse(text);
    } catch (e) {
      return text;
    }
  }

  function upload(option) {
    if (typeof XMLHttpRequest === 'undefined') {
      return;
    }

    const xhr = new XMLHttpRequest();
    const action = option.action;

    if (xhr.upload) {
      xhr.upload.onprogress = function progress(e) {
        if (e.total > 0) {
          e.percent = e.loaded / e.total * 100;
        }

        option.onProgress(e);
      };
    }

    const formData = new FormData();

    if (option.data) {
      Object.keys(option.data).forEach(key => {
        formData.append(key, option.data[key]);
      });
    }

    formData.append(option.filename, option.file, option.file.name);

    xhr.onerror = function error(e) {
      option.onError(e);
    };

    xhr.onload = function onload() {
      if (xhr.status < 200 || xhr.status >= 300) {
        return option.onError(getError(action, option, xhr));
      }

      option.onSuccess(getBody(xhr));
    };

    xhr.open('post', action, true);

    if (option.withCredentials && 'withCredentials' in xhr) {
      xhr.withCredentials = true;
    }

    const headers = option.headers || {};

    for (const item in headers) {
      if (Object.hasOwnProperty.call(headers, item) && headers[item] !== null) {
        xhr.setRequestHeader(item, headers[item]);
      }
    }

    xhr.send(formData);
    return xhr;
  }

  var script$14 = {
    name: 'ElUploadDrag',
    props: {
      disabled: Boolean
    },
    emits: ['file'],
    inject: ['uploader'],

    setup(props, {
      emit
    }) {
      const uploader = vue.inject('uploader', {});
      const {
        disabled
      } = vue.toRefs(props);
      const dragover = vue.ref(false);

      const onDragover = () => {
        if (!disabled.value) {
          dragover.value = true;
        }
      };

      const onDrop = e => {
        if (disabled.value || !uploader) return;
        const accept = uploader.accept;
        dragover.value = false;

        if (!accept) {
          emit('file', e.dataTransfer.files);
          return;
        }

        emit('file', [].slice.call(e.dataTransfer.files).filter(file => {
          const {
            type,
            name
          } = file;
          const extension = name.indexOf('.') > -1 ? `.${name.split('.').pop()}` : '';
          const baseType = type.replace(/\/.*$/, '');
          return accept.split(',').map(type => type.trim()).filter(type => type).some(acceptedType => {
            if (/\..+$/.test(acceptedType)) {
              return extension === acceptedType;
            }

            if (/\/\*$/.test(acceptedType)) {
              return baseType === acceptedType.replace(/\/\*$/, '');
            } // eslint-disable-next-line no-useless-escape


            if (/^[^\/]+\/[^\/]+$/.test(acceptedType)) {
              return type === acceptedType;
            }

            return false;
          });
        }));
      };

      return {
        onDragover,
        onDrop,
        dragover
      };
    }

  };

  function render$X(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("div", {
      class: ["el-upload-dragger", {
        'is-dragover': $setup.dragover
      }],
      onDrop: _cache[1] || (_cache[1] = vue.withModifiers((...args) => $setup.onDrop && $setup.onDrop(...args), ["prevent"])),
      onDragover: _cache[2] || (_cache[2] = vue.withModifiers((...args) => $setup.onDragover && $setup.onDragover(...args), ["prevent"])),
      onDragleave: _cache[3] || (_cache[3] = vue.withModifiers($event => $setup.dragover = false, ["prevent"]))
    }, [vue.renderSlot(_ctx.$slots, "default")], 34
    /* CLASS, HYDRATE_EVENTS */
    );
  }

  script$14.render = render$X;
  script$14.__file = "packages/upload/src/upload-dragger.vue";

  var script$13 = {
    inject: ['uploader'],
    components: {
      UploadDragger: script$14
    },
    props: {
      type: String,
      action: {
        type: String,
        required: true
      },
      name: {
        type: String,
        default: 'file'
      },
      data: Object,
      headers: Object,
      withCredentials: Boolean,
      multiple: Boolean,
      accept: String,
      onStart: Function,
      onProgress: Function,
      onSuccess: Function,
      onError: Function,
      beforeUpload: Function,
      drag: Boolean,
      onPreview: {
        type: Function,
        default: function () {}
      },
      onRemove: {
        type: Function,
        default: function () {}
      },
      fileList: Array,
      autoUpload: Boolean,
      listType: String,
      httpRequest: {
        type: Function,
        default: upload
      },
      disabled: Boolean,
      limit: Number,
      onExceed: Function
    },

    setup(props) {
      const {
        limit,
        fileList,
        onExceed,
        multiple,
        autoUpload
      } = vue.toRefs(props); // eslint-disable-next-line vue/no-setup-props-destructure

      const {
        onStart,
        beforeUpload,
        httpRequest,
        onProgress,
        onSuccess,
        onError,
        disabled,
        onRemove
      } = props;
      const mouseover = vue.ref(false);
      const reqs = vue.reactive({});
      const input = vue.ref(null);

      const isImage = str => {
        return str.indexOf('image') !== -1;
      };

      const handleChange = ev => {
        const files = ev.target.files;
        if (!files) return;
        uploadFiles(files);
      };

      const uploadFiles = files => {
        if (limit.value && fileList.length + files.length > limit.value) {
          onExceed && onExceed(files, fileList);
          return;
        }

        let postFiles = Array.prototype.slice.call(files);

        if (!multiple.value) {
          postFiles = postFiles.slice(0, 1);
        }

        if (postFiles.length === 0) {
          return;
        }

        postFiles.forEach(rawFile => {
          onStart(rawFile);
          if (autoUpload.value) upload(rawFile);
        });
      };

      const upload = rawFile => {
        input.value.value = null;

        if (!beforeUpload) {
          return post(rawFile);
        }

        const before = beforeUpload(rawFile);

        if (before && before.then) {
          before.then(processedFile => {
            const fileType = Object.prototype.toString.call(processedFile);

            if (fileType === '[object File]' || fileType === '[object Blob]') {
              if (fileType === '[object Blob]') {
                processedFile = new File([processedFile], rawFile.name, {
                  type: rawFile.type
                });
              }

              for (const p in rawFile) {
                if (Object.hasOwnProperty.call(rawFile, p)) {
                  processedFile[p] = rawFile[p];
                }
              }

              post(processedFile);
            } else {
              post(rawFile);
            }
          }, () => {
            onRemove(null, rawFile);
          });
        } else if (before !== false) {
          post(rawFile);
        } else {
          onRemove(null, rawFile);
        }
      };

      const abort = file => {
        if (file) {
          let uid = file;
          if (file.uid) uid = file.uid;

          if (reqs[uid]) {
            reqs[uid].abort();
          }
        } else {
          Object.keys(reqs).forEach(uid => {
            if (reqs[uid]) reqs[uid].abort();
            delete reqs[uid];
          });
        }
      };

      const post = rawFile => {
        const {
          uid
        } = rawFile;
        const options = {
          headers: props.headers,
          withCredentials: props.withCredentials,
          file: rawFile,
          data: props.data,
          filename: props.name,
          action: props.action,
          onProgress: e => {
            onProgress(e, rawFile);
          },
          onSuccess: res => {
            onSuccess(res, rawFile);
            delete reqs[uid];
          },
          onError: err => {
            onError(err, rawFile);
            delete reqs[uid];
          }
        };
        const req = httpRequest(options);
        reqs[uid] = req;

        if (req && req.then) {
          req.then(options.onSuccess, options.onError);
        }
      };

      const handleClick = () => {
        if (!vue.unref(disabled)) {
          input.value.value = null;
          input.value.click();
        }
      };

      const handleKeydown = e => {
        if (e.target !== e.currentTarget) return;

        if (e.keyCode === 13 || e.keyCode === 32) {
          handleClick();
        }
      };

      return {
        mouseover,
        isImage,
        handleChange,
        uploadFiles,
        handleClick,
        handleKeydown,
        post,
        upload,
        input,
        reqs,
        abort
      };
    }

  };

  function render$W(_ctx, _cache, $props, $setup, $data, $options) {
    const _component_upload_dragger = vue.resolveComponent("upload-dragger");

    return vue.openBlock(), vue.createBlock("div", {
      class: ["el-upload", {
        [`el-upload--${$props.listType}`]: true
      }],
      onClick: _cache[2] || (_cache[2] = (...args) => $setup.handleClick && $setup.handleClick(...args)),
      onKeydown: _cache[3] || (_cache[3] = (...args) => $setup.handleKeydown && $setup.handleKeydown(...args)),
      tabindex: "0"
    }, [$props.drag ? (vue.openBlock(), vue.createBlock(_component_upload_dragger, {
      key: 0,
      disabled: $props.disabled,
      onFile: $setup.uploadFiles
    }, {
      default: vue.withCtx(() => [vue.renderSlot(_ctx.$slots, "default")]),
      _: 3
      /* FORWARDED */

    }, 8
    /* PROPS */
    , ["disabled", "onFile"])) : vue.renderSlot(_ctx.$slots, "default", {
      key: 1
    }), vue.createVNode("input", {
      class: "el-upload__input",
      type: "file",
      ref: "input",
      name: $props.name,
      onChange: _cache[1] || (_cache[1] = (...args) => $setup.handleChange && $setup.handleChange(...args)),
      multiple: $props.multiple,
      accept: $props.accept
    }, null, 40
    /* PROPS, HYDRATE_EVENTS */
    , ["name", "multiple", "accept"])], 34
    /* CLASS, HYDRATE_EVENTS */
    );
  }

  script$13.render = render$W;
  script$13.__file = "packages/upload/src/upload.vue";

  /**
   * Show migrating guide in browser console.
   *
   * Usage:
   * import Migrating from 'element-ui/src/mixins/migrating';
   *
   * mixins: [Migrating]
   *
   * add getMigratingConfig method for your component.
   *  getMigratingConfig() {
   *    return {
   *      props: {
   *        'allow-no-selection': 'allow-no-selection is removed.',
   *        'selection-mode': 'selection-mode is removed.'
   *      },
   *      events: {
   *        selectionchange: 'selectionchange is renamed to selection-change.'
   *      }
   *    };
   *  },
   */

  var Migrating = {
    mounted() {
      if (!this.$vnode) return;
      const {
        props = {},
        events = {}
      } = this.getMigratingConfig();
      const {
        data,
        componentOptions
      } = this.$vnode;
      const definedProps = data.attrs || {};
      const definedEvents = componentOptions.listeners || {};

      for (let propName in definedProps) {
        propName = kebabCase(propName); // compatible with camel case

        if (props[propName]) {
          console.warn(`[Element Migrating][${this.$options.name}][Attribute]: ${props[propName]}`);
        }
      }

      for (let eventName in definedEvents) {
        eventName = kebabCase(eventName); // compatible with camel case

        if (events[eventName]) {
          console.warn(`[Element Migrating][${this.$options.name}][Event]: ${events[eventName]}`);
        }
      }
    },

    methods: {
      getMigratingConfig() {
        return {
          props: {},
          events: {}
        };
      }

    }
  };

  function noop() {}

  var script$12 = {
    name: 'ElUpload',
    mixins: [Migrating],
    components: {
      UploadList: script$15,
      Upload: script$13
    },

    provide() {
      return {
        uploader: this
      };
    },

    inject: {
      elForm: {
        default: ''
      }
    },
    props: {
      action: {
        type: String,
        required: true
      },
      headers: {
        type: Object,

        default() {
          return {};
        }

      },
      data: Object,
      multiple: Boolean,
      name: {
        type: String,
        default: 'file'
      },
      drag: Boolean,
      dragger: Boolean,
      withCredentials: Boolean,
      showFileList: {
        type: Boolean,
        default: true
      },
      accept: String,
      type: {
        type: String,
        default: 'select'
      },
      beforeUpload: Function,
      beforeRemove: Function,
      onRemove: {
        type: Function,
        default: noop
      },
      onChange: {
        type: Function,
        default: noop
      },
      onPreview: {
        type: Function
      },
      onSuccess: {
        type: Function,
        default: noop
      },
      onProgress: {
        type: Function,
        default: noop
      },
      onError: {
        type: Function,
        default: noop
      },
      fileList: {
        type: Array,

        default() {
          return [];
        }

      },
      autoUpload: {
        type: Boolean,
        default: true
      },
      listType: {
        type: String,
        default: 'text' // text,picture,picture-card

      },
      httpRequest: Function,
      disabled: Boolean,
      limit: Number,
      onExceed: {
        type: Function,
        default: noop
      }
    },

    setup(props) {
      const {
        disabled,
        listType,
        fileList
      } = vue.toRefs(props); // eslint-disable-next-line vue/no-setup-props-destructure

      const {
        onRemove,
        beforeRemove,
        onProgress,
        onSuccess,
        onError,
        onChange
      } = props;
      let tempIndex = 1;
      let uploadFiles = vue.reactive(fileList.value.map(item => {
        item.uid = item.uid || Date.now() + tempIndex++;
        item.status = item.status || 'success';
        return item;
      }));
      const dragOver = vue.ref(false);
      const draging = vue.ref(false);
      const uploadInner = vue.ref(null);
      const uploadDisabled = vue.computed(() => {
        const elForm = vue.inject('elForm', {});
        return disabled.value || vue.unref((elForm || {}).disabled);
      });
      vue.watch(listType, type => {
        if (type === 'picture-card' || type === 'picture') {
          uploadFiles.forEach(file => {
            if (!file.url && file.raw) {
              try {
                file.url = URL.createObjectURL(file.raw);
              } catch (err) {
                console.error('[Element Error][Upload]', err);
              }
            }
          });
        }
      });
      vue.onUnmounted(() => {
        uploadFiles.forEach(file => {
          if (file.url && file.url.indexOf('blob:') === 0) {
            URL.revokeObjectURL(file.url);
          }
        });
      });

      const abort = file => {
        uploadInner.value.abort(file);
      };

      const getFile = rawFile => {
        const fileList = uploadFiles;
        let target;
        fileList.every(item => {
          target = rawFile.uid === item.uid ? item : null;
          return !target;
        });
        return target;
      };

      const handleRemove = (file, raw) => {
        if (raw) {
          file = getFile(raw);
        }

        const doRemove = () => {
          abort(file);
          const fileList = uploadFiles;
          fileList.splice(fileList.indexOf(file), 1);
          onRemove(file, fileList);
        };

        if (!beforeRemove) {
          doRemove();
        } else if (typeof beforeRemove === 'function') {
          const before = beforeRemove(file, uploadFiles);

          if (before && before.then) {
            before.then(() => {
              doRemove();
            }, noop);
          } else if (before !== false) {
            doRemove();
          }
        }
      };

      const handleProgress = (ev, rawFile) => {
        const file = getFile(rawFile);
        onProgress(ev, file, uploadFiles);
        file.status = 'uploading';
        file.percentage = ev.percent || 0;
      };

      const handleSuccess = (res, rawFile) => {
        const file = getFile(rawFile);

        if (file) {
          file.status = 'success';
          file.response = res;
          onSuccess(res, file, uploadFiles);
          onChange(file, uploadFiles);
        }
      };

      const handleError = (err, rawFile) => {
        const file = getFile(rawFile);
        const fileList = uploadFiles;
        file.status = 'fail';
        fileList.splice(fileList.indexOf(file), 1);
        onError(err, file, uploadFiles);
        onChange(file, uploadFiles);
      };

      const handleStart = rawFile => {
        rawFile.uid = Date.now() + tempIndex++;
        const file = {
          status: 'ready',
          name: rawFile.name,
          size: rawFile.size,
          percentage: 0,
          uid: rawFile.uid,
          raw: rawFile
        };

        if (vue.unref(listType) === 'picture-card' || vue.unref(listType) === 'picture') {
          try {
            file.url = URL.createObjectURL(rawFile);
          } catch (err) {
            console.error('[Element Error][Upload]', err);
            return;
          }
        }

        uploadFiles.push(file);
        onChange(file, uploadFiles);
      };

      const clearFiles = () => {
        uploadFiles = [];
      };

      const submit = () => {
        uploadFiles.filter(file => file.status === 'ready').forEach(file => {
          uploadInner.value.upload(file.raw);
        });
      };

      const getMigratingConfig = () => {
        return {
          props: {
            'default-file-list': 'default-file-list is renamed to file-list.',
            'show-upload-list': 'show-upload-list is renamed to show-file-list.',
            'thumbnail-mode': 'thumbnail-mode has been deprecated, you can implement the same effect according to this case: http://element.eleme.io/#/zh-CN/component/upload#yong-hu-tou-xiang-shang-chuan'
          }
        };
      };

      return {
        uploadFiles,
        uploadInner,
        dragOver,
        draging,
        uploadDisabled,
        handleRemove,
        abort,
        handleStart,
        handleProgress,
        handleSuccess,
        handleError,
        clearFiles,
        submit,
        getMigratingConfig
      };
    }

  };

  const _hoisted_1$G = {
    key: 1
  };
  function render$V(_ctx, _cache, $props, $setup, $data, $options) {
    const _component_UploadList = vue.resolveComponent("UploadList");

    const _component_upload = vue.resolveComponent("upload");

    return vue.openBlock(), vue.createBlock("div", null, [$props.listType === 'picture-card' && $props.showFileList ? (vue.openBlock(), vue.createBlock(_component_UploadList, {
      key: 0,
      disabled: $setup.uploadDisabled,
      listType: $props.listType,
      files: $setup.uploadFiles,
      onRemove: $setup.handleRemove,
      handlePreview: $props.onPreview
    }, vue.createSlots({
      _: 2
      /* DYNAMIC */

    }, [_ctx.$slots.file ? {
      name: "default",
      fn: vue.withCtx(props => [vue.renderSlot(_ctx.$slots, "file", {
        file: props.file
      })])
    } : undefined]), 1032
    /* PROPS, DYNAMIC_SLOTS */
    , ["disabled", "listType", "files", "onRemove", "handlePreview"])) : vue.createCommentVNode("v-if", true), _ctx.$slots.trigger ? (vue.openBlock(), vue.createBlock("div", _hoisted_1$G, [vue.createVNode(_component_upload, {
      type: $props.type,
      drag: $props.drag,
      action: $props.action,
      multiple: $props.multiple,
      "before-upload": $props.beforeUpload,
      "with-credentials": $props.withCredentials,
      headers: $props.headers,
      name: $props.name,
      data: $props.data,
      accept: $props.accept,
      fileList: $setup.uploadFiles,
      autoUpload: $props.autoUpload,
      listType: $props.listType,
      disabled: $setup.uploadDisabled,
      limit: $props.limit,
      onExceed: $props.onExceed,
      onStart: $setup.handleStart,
      onProgress: $setup.handleProgress,
      onSuccess: $setup.handleSuccess,
      onError: $setup.handleError,
      onPreview: $props.onPreview,
      onRemove: $setup.handleRemove,
      "http-request": $props.httpRequest,
      ref: "uploadInner"
    }, {
      default: vue.withCtx(() => [vue.renderSlot(_ctx.$slots, "trigger")]),
      _: 3
      /* FORWARDED */

    }, 8
    /* PROPS */
    , ["type", "drag", "action", "multiple", "before-upload", "with-credentials", "headers", "name", "data", "accept", "fileList", "autoUpload", "listType", "disabled", "limit", "onExceed", "onStart", "onProgress", "onSuccess", "onError", "onPreview", "onRemove", "http-request"]), vue.renderSlot(_ctx.$slots, "default")])) : (vue.openBlock(), vue.createBlock(_component_upload, {
      key: 2,
      type: $props.type,
      drag: $props.drag,
      action: $props.action,
      multiple: $props.multiple,
      "before-upload": $props.beforeUpload,
      "with-credentials": $props.withCredentials,
      headers: $props.headers,
      name: $props.name,
      data: $props.data,
      accept: $props.accept,
      fileList: $setup.uploadFiles,
      autoUpload: $props.autoUpload,
      listType: $props.listType,
      disabled: $setup.uploadDisabled,
      limit: $props.limit,
      onExceed: $props.onExceed,
      onStart: $setup.handleStart,
      onProgress: $setup.handleProgress,
      onSuccess: $setup.handleSuccess,
      onError: $setup.handleError,
      onPreview: $props.onPreview,
      onRemove: $setup.handleRemove,
      "http-request": $props.httpRequest,
      ref: "uploadInner"
    }, {
      default: vue.withCtx(() => [vue.renderSlot(_ctx.$slots, "trigger"), vue.renderSlot(_ctx.$slots, "default")]),
      _: 3
      /* FORWARDED */

    }, 8
    /* PROPS */
    , ["type", "drag", "action", "multiple", "before-upload", "with-credentials", "headers", "name", "data", "accept", "fileList", "autoUpload", "listType", "disabled", "limit", "onExceed", "onStart", "onProgress", "onSuccess", "onError", "onPreview", "onRemove", "http-request"])), vue.renderSlot(_ctx.$slots, "tip"), $props.listType !== 'picture-card' && $props.showFileList ? (vue.openBlock(), vue.createBlock(_component_UploadList, {
      key: 3,
      disabled: $setup.uploadDisabled,
      listType: $props.listType,
      files: $setup.uploadFiles,
      onRemove: $setup.handleRemove,
      handlePreview: $props.onPreview
    }, vue.createSlots({
      _: 2
      /* DYNAMIC */

    }, [_ctx.$slots.file ? {
      name: "default",
      fn: vue.withCtx(props => [vue.renderSlot(_ctx.$slots, "file", {
        file: props.file
      })])
    } : undefined]), 1032
    /* PROPS, DYNAMIC_SLOTS */
    , ["disabled", "listType", "files", "onRemove", "handlePreview"])) : vue.createCommentVNode("v-if", true)]);
  }

  script$12.render = render$V;
  script$12.__file = "packages/upload/src/index.vue";

  /* istanbul ignore next */

  script$12.install = function (app) {
    app.component(script$12.name, script$12);
  };

  var script$11 = {
    name: 'ElRate',
    props: {
      modelValue: {
        type: Number,
        default: 0
      },
      lowThreshold: {
        type: Number,
        default: 2
      },
      highThreshold: {
        type: Number,
        default: 4
      },
      max: {
        type: Number,
        default: 5
      },
      colors: {
        type: [Array, Object],

        default() {
          return ['#F7BA2A', '#F7BA2A', '#F7BA2A'];
        }

      },
      voidColor: {
        type: String,
        default: '#C6D1DE'
      },
      disabledVoidColor: {
        type: String,
        default: '#EFF2F7'
      },
      iconClasses: {
        type: [Array, Object],

        default() {
          return ['el-icon-star-on', 'el-icon-star-on', 'el-icon-star-on'];
        }

      },
      voidIconClass: {
        type: String,
        default: 'el-icon-star-off'
      },
      disabledVoidIconClass: {
        type: String,
        default: 'el-icon-star-on'
      },
      disabled: {
        type: Boolean,
        default: false
      },
      allowHalf: {
        type: Boolean,
        default: false
      },
      showText: {
        type: Boolean,
        default: false
      },
      showScore: {
        type: Boolean,
        default: false
      },
      textColor: {
        type: String,
        default: '#1f2d3d'
      },
      texts: {
        type: Array,

        default() {
          return ['极差', '失望', '一般', '满意', '惊喜'];
        }

      },
      scoreTemplate: {
        type: String,
        default: '{value}'
      }
    },
    emits: ['update:modelValue', 'change'],

    setup(props, {
      emit
    }) {
      const {
        modelValue,
        disabled,
        allowHalf,
        disabledVoidIconClass,
        voidIconClass,
        iconClasses,
        max,
        lowThreshold,
        highThreshold,
        texts,
        colors,
        voidColor,
        disabledVoidColor,
        showScore,
        scoreTemplate,
        showText
      } = vue.toRefs(props);
      migrating({
        'text-template': 'text-template is renamed to score-template.'
      });
      modelValue || emit('update:modelValue', 0);
      const elForm = vue.inject('elForm', {});
      const rateDisabled = useDisabled(disabled, elForm);
      const {
        currentValue,
        hoverIndex,
        pointerAtLeftHalf,
        setCurrentValue,
        resetCurrentValue,
        selectValue,
        handleKey
      } = useCurrentValue({
        modelValue,
        allowHalf,
        rateDisabled,
        max
      });
      const {
        classMap,
        colorMap
      } = useMaps({
        colors,
        iconClasses,
        lowThreshold,
        highThreshold,
        max
      });
      const {
        classes,
        decimalIconClass
      } = useClasses({
        currentValue,
        modelValue,
        classMap,
        allowHalf,
        max,
        rateDisabled,
        disabledVoidIconClass,
        voidIconClass
      });
      const {
        activeColor,
        getIconStyle
      } = useColor({
        currentValue,
        colorMap,
        rateDisabled,
        disabledVoidColor,
        voidColorProp: voidColor
      });
      const {
        decimalStyle,
        showDecimalIcon
      } = useDecimal({
        currentValue,
        modelValue,
        allowHalf,
        rateDisabled,
        pointerAtLeftHalf,
        activeColor
      });
      const text = vue.computed(() => {
        let result = '';

        if (showScore.value) {
          result = scoreTemplate.value.replace(/\{\s*value\s*\}/, vue.unref(rateDisabled) ? modelValue.value : currentValue.value);
        } else if (showText.value) {
          result = texts.value[Math.ceil(currentValue.value) - 1];
        }

        return result;
      });
      return {
        // state
        rateDisabled,
        classMap,
        classes,
        text,
        hoverIndex,
        decimalStyle,
        decimalIconClass,
        // methods
        getIconStyle,
        setCurrentValue,
        resetCurrentValue,
        selectValue,
        handleKey,
        showDecimalIcon
      };
    }

  };

  const getValueFromMap = (value, map) => {
    map = vue.unref(map);
    const matchedKeys = Object.keys(map).filter(key => {
      const val = map[key];
      const excluded = val instanceof Object ? val.excluded : false;
      return excluded ? value < key : value <= key;
    }).sort((a, b) => a - b);
    const matchedValue = map[matchedKeys[0]];
    return matchedValue instanceof Object ? matchedValue.value : matchedValue || '';
  };

  const useDisabled = (disabled, elForm) => {
    return vue.computed(() => disabled.value || elForm.disabled);
  };

  const useMaps = ({
    colors,
    iconClasses,
    lowThreshold,
    highThreshold,
    max
  }) => {
    const useMap = (mapData, {
      lowThreshold,
      highThreshold,
      max
    }) => {
      return vue.computed(() => Array.isArray(mapData) ? {
        [lowThreshold.value]: mapData[0],
        [highThreshold.value]: {
          value: mapData[1],
          excluded: true
        },
        [max.value]: mapData[2]
      } : mapData);
    };

    return {
      classMap: useMap(vue.unref(iconClasses), {
        lowThreshold,
        highThreshold,
        max
      }),
      colorMap: useMap(vue.unref(colors), {
        lowThreshold,
        highThreshold,
        max
      })
    };
  };

  const useClasses = ({
    currentValue,
    modelValue,
    classMap,
    allowHalf,
    max,
    rateDisabled,
    disabledVoidIconClass,
    voidIconClass
  }) => {
    const activeClass = vue.computed(() => getValueFromMap(currentValue.value, vue.unref(classMap)));
    const voidClass = vue.computed(() => vue.unref(rateDisabled) ? disabledVoidIconClass.value : voidIconClass.value);
    const decimalIconClass = vue.computed(() => getValueFromMap(modelValue.value, vue.unref(classMap)));
    const classes = vue.computed(() => {
      const result = [];
      let i = 0;
      let threshold = currentValue.value;

      if (allowHalf.value && currentValue.value !== Math.floor(currentValue.value)) {
        threshold--;
      }

      for (; i < threshold; i++) {
        result.push(activeClass.value);
      }

      for (; i < max.value; i++) {
        result.push(voidClass.value);
      }

      return result;
    });
    return {
      classes,
      decimalIconClass
    };
  };

  const useColor = ({
    currentValue,
    colorMap,
    rateDisabled,
    disabledVoidColor,
    voidColorProp
  }) => {
    const activeColor = vue.computed(() => getValueFromMap(currentValue.value, colorMap));

    const getIconStyle = item => {
      const voidColor = rateDisabled.value ? disabledVoidColor.value : voidColorProp.value;
      return {
        color: vue.unref(item <= currentValue.value ? activeColor.value : voidColor)
      };
    };

    return {
      activeColor,
      getIconStyle
    };
  };

  const useDecimal = ({
    currentValue,
    modelValue,
    allowHalf,
    rateDisabled,
    pointerAtLeftHalf,
    activeColor
  }) => {
    const valueDecimal = vue.computed(() => modelValue.value * 100 - Math.floor(modelValue.value) * 100);
    const decimalStyle = vue.computed(() => {
      let width = '';

      if (vue.unref(rateDisabled)) {
        width = `${valueDecimal.value}%`;
      } else if (allowHalf.value) {
        width = '50%';
      }

      return {
        color: activeColor.value,
        width
      };
    });

    const showDecimalIcon = item => {
      const showWhenDisabled = vue.unref(rateDisabled) && valueDecimal.value > 0 && item - 1 < modelValue.value && item > modelValue.value;
      /* istanbul ignore next */

      const showWhenAllowHalf = allowHalf.value && pointerAtLeftHalf && item - 0.5 <= currentValue.value && item > currentValue.value;
      return showWhenDisabled || showWhenAllowHalf;
    };

    return {
      decimalStyle,
      showDecimalIcon
    };
  };

  const useCurrentValue = ({
    modelValue,
    allowHalf,
    rateDisabled,
    max
  }) => {
    const {
      emit
    } = vue.getCurrentInstance();
    const currentValue = vue.ref(modelValue.value);
    const pointerAtLeftHalf = vue.ref(false);
    const hoverIndex = vue.ref(-1);
    vue.watch(modelValue, v => {
      currentValue.value = v;
    });

    const setCurrentValue = (value, event) => {
      if (rateDisabled.value) {
        return;
      }
      /* istanbul ignore if */


      if (allowHalf.value) {
        let target = event.target;

        if (hasClass(target, 'el-rate__item')) {
          target = target.querySelector('.el-rate__icon');
        }

        if (hasClass(target, 'el-rate__decimal')) {
          target = target.parentNode;
        }

        pointerAtLeftHalf.value = event.offsetX * 2 <= target.clientWidth;
        currentValue.value = pointerAtLeftHalf.value ? value - 0.5 : value;
      } else {
        currentValue.value = value;
      }

      hoverIndex.value = value;
    };

    const resetCurrentValue = () => {
      if (rateDisabled.value) {
        return;
      }

      if (allowHalf.value) {
        pointerAtLeftHalf.value = modelValue.value !== Math.floor(modelValue.value);
      }

      currentValue.value = modelValue.value;
      hoverIndex.value = -1;
    };

    const selectValue = value => {
      if (rateDisabled.value) {
        return;
      }

      if (allowHalf.value && pointerAtLeftHalf.value) {
        emit('update:modelValue', currentValue.value);
        emit('change', currentValue.value);
      } else {
        emit('update:modelValue', value);
        emit('change', value);
      }
    };

    const handleKey = e => {
      if (rateDisabled.value) {
        return;
      }

      let value = currentValue.value;
      const keyCode = e.keyCode;

      if (keyCode === 38 || keyCode === 39) {
        // left / down
        if (allowHalf.value) {
          value += 0.5;
        } else {
          value += 1;
        }

        e.stopPropagation();
        e.preventDefault();
      } else if (keyCode === 37 || keyCode === 40) {
        if (allowHalf.value) {
          value -= 0.5;
        } else {
          value -= 1;
        }

        e.stopPropagation();
        e.preventDefault();
      }

      value = value < 0 ? 0 : value;
      value = value > max.value ? max.value : value;
      emit('update:modelValue', value);
      emit('change', value);
    };

    return {
      currentValue,
      hoverIndex,
      pointerAtLeftHalf,
      setCurrentValue,
      resetCurrentValue,
      selectValue,
      handleKey
    };
  };

  function render$U(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("div", {
      class: "el-rate",
      onKeydown: _cache[2] || (_cache[2] = (...args) => $setup.handleKey && $setup.handleKey(...args)),
      role: "slider",
      "aria-valuenow": $props.modelValue,
      "aria-valuetext": $setup.text,
      "aria-valuemin": "0",
      "aria-valuemax": $props.max,
      tabindex: "0"
    }, [(vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList($props.max, (item, key) => {
      return vue.openBlock(), vue.createBlock("span", {
        class: "el-rate__item",
        onMousemove: $event => $setup.setCurrentValue(item, $event),
        onMouseleave: _cache[1] || (_cache[1] = (...args) => $setup.resetCurrentValue && $setup.resetCurrentValue(...args)),
        onClick: $event => $setup.selectValue(item),
        style: {
          cursor: $setup.rateDisabled ? 'auto' : 'pointer'
        },
        key: key
      }, [vue.createVNode("i", {
        class: ["el-rate__icon", [$setup.classes[item - 1], {
          hover: $setup.hoverIndex === item
        }]],
        style: $setup.getIconStyle(item)
      }, [$setup.showDecimalIcon(item) ? (vue.openBlock(), vue.createBlock("i", {
        key: 0,
        class: ["el-rate__decimal", $setup.decimalIconClass],
        style: $setup.decimalStyle
      }, null, 6
      /* CLASS, STYLE */
      )) : vue.createCommentVNode("v-if", true)], 6
      /* CLASS, STYLE */
      )], 44
      /* STYLE, PROPS, HYDRATE_EVENTS */
      , ["onMousemove", "onClick"]);
    }), 128
    /* KEYED_FRAGMENT */
    )), $props.showText || $props.showScore ? (vue.openBlock(), vue.createBlock("span", {
      key: 0,
      class: "el-rate__text",
      style: {
        color: $props.textColor
      }
    }, vue.toDisplayString($setup.text), 5
    /* TEXT, STYLE */
    )) : vue.createCommentVNode("v-if", true)], 40
    /* PROPS, HYDRATE_EVENTS */
    , ["aria-valuenow", "aria-valuetext", "aria-valuemax"]);
  }

  script$11.render = render$U;
  script$11.__file = "packages/rate/Rate.vue";

  /* istanbul ignore next */

  script$11.install = function (app) {
    app.component(script$11.name, script$11);
  };

  /* eslint-disable no-case-declarations */

  /* eslint-disable prefer-const */
  const hsv2hsl = function (hue, sat, val) {
    return [hue, sat * val / ((hue = (2 - sat) * val) < 1 ? hue : 2 - hue) || 0, hue / 2];
  }; // Need to handle 1.0 as 100%, since once it is a number, there is no difference between it and 1
  // <http://stackoverflow.com/questions/7422072/javascript-how-to-detect-number-as-a-decimal-including-1-0>


  const isOnePointZero = function (n) {
    return typeof n === 'string' && n.indexOf('.') !== -1 && parseFloat(n) === 1;
  };

  const isPercentage = function (n) {
    return typeof n === 'string' && n.indexOf('%') !== -1;
  }; // Take input from [0, n] and return it as [0, 1]


  const bound01 = function (value, max) {
    if (isOnePointZero(value)) value = '100%';
    const processPercent = isPercentage(value);
    value = Math.min(max, Math.max(0, parseFloat(value))); // Automatically convert percentage into number

    if (processPercent) {
      value = parseInt(value * max, 10) / 100;
    } // Handle floating point rounding errors


    if (Math.abs(value - max) < 0.000001) {
      return 1;
    } // Convert into [0, 1] range if it isn't already


    return value % max / parseFloat(max);
  };

  const INT_HEX_MAP = {
    10: 'A',
    11: 'B',
    12: 'C',
    13: 'D',
    14: 'E',
    15: 'F'
  };

  const toHex = function ({
    r,
    g,
    b
  }) {
    const hexOne = function (value) {
      value = Math.min(Math.round(value), 255);
      const high = Math.floor(value / 16);
      const low = value % 16;
      return '' + (INT_HEX_MAP[high] || high) + (INT_HEX_MAP[low] || low);
    };

    if (isNaN(r) || isNaN(g) || isNaN(b)) return '';
    return '#' + hexOne(r) + hexOne(g) + hexOne(b);
  };

  const HEX_INT_MAP = {
    A: 10,
    B: 11,
    C: 12,
    D: 13,
    E: 14,
    F: 15
  };

  const parseHexChannel = function (hex) {
    if (hex.length === 2) {
      return (HEX_INT_MAP[hex[0].toUpperCase()] || +hex[0]) * 16 + (HEX_INT_MAP[hex[1].toUpperCase()] || +hex[1]);
    }

    return HEX_INT_MAP[hex[1].toUpperCase()] || +hex[1];
  };

  const hsl2hsv = function (hue, sat, light) {
    sat = sat / 100;
    light = light / 100;
    let smin = sat;
    const lmin = Math.max(light, 0.01);
    let sv;
    let v;
    light *= 2;
    sat *= light <= 1 ? light : 2 - light;
    smin *= lmin <= 1 ? lmin : 2 - lmin;
    v = (light + sat) / 2;
    sv = light === 0 ? 2 * smin / (lmin + smin) : 2 * sat / (light + sat);
    return {
      h: hue,
      s: sv * 100,
      v: v * 100
    };
  }; // `rgbToHsv`
  // Converts an RGB color value to HSV
  // *Assumes:* r, g, and b are contained in the set [0, 255] or [0, 1]
  // *Returns:* { h, s, v } in [0,1]


  const rgb2hsv = function (r, g, b) {
    r = bound01(r, 255);
    g = bound01(g, 255);
    b = bound01(b, 255);
    const max = Math.max(r, g, b);
    const min = Math.min(r, g, b);
    let h, s;
    const v = max;
    const d = max - min;
    s = max === 0 ? 0 : d / max;

    if (max === min) {
      h = 0; // achromatic
    } else {
      switch (max) {
        case r:
          h = (g - b) / d + (g < b ? 6 : 0);
          break;

        case g:
          h = (b - r) / d + 2;
          break;

        case b:
          h = (r - g) / d + 4;
          break;
      }

      h /= 6;
    }

    return {
      h: h * 360,
      s: s * 100,
      v: v * 100
    };
  }; // `hsvToRgb`
  // Converts an HSV color value to RGB.
  // *Assumes:* h is contained in [0, 1] or [0, 360] and s and v are contained in [0, 1] or [0, 100]
  // *Returns:* { r, g, b } in the set [0, 255]


  const hsv2rgb = function (h, s, v) {
    h = bound01(h, 360) * 6;
    s = bound01(s, 100);
    v = bound01(v, 100);
    const i = Math.floor(h);
    const f = h - i;
    const p = v * (1 - s);
    const q = v * (1 - f * s);
    const t = v * (1 - (1 - f) * s);
    const mod = i % 6;
    const r = [v, q, p, p, t, v][mod];
    const g = [t, v, v, q, p, p][mod];
    const b = [p, p, t, v, v, q][mod];
    return {
      r: Math.round(r * 255),
      g: Math.round(g * 255),
      b: Math.round(b * 255)
    };
  };

  class Color {
    constructor(options) {
      this._hue = 0;
      this._saturation = 100;
      this._value = 100;
      this._alpha = 100;
      this.enableAlpha = false;
      this.format = 'hex';
      this.value = '';
      options = options || {};

      for (const option in options) {
        if (Object.hasOwnProperty.call(options, option)) {
          this[option] = options[option];
        }
      }

      this.doOnChange();
    }

    set(prop, value) {
      if (arguments.length === 1 && typeof prop === 'object') {
        for (const p in prop) {
          if (Object.hasOwnProperty.call(prop, p)) {
            this.set(p, prop[p]);
          }
        }

        return;
      }

      this['_' + prop] = value;
      this.doOnChange();
    }

    get(prop) {
      return this['_' + prop];
    }

    toRgb() {
      return hsv2rgb(this._hue, this._saturation, this._value);
    }

    fromString(value) {
      if (!value) {
        this._hue = 0;
        this._saturation = 100;
        this._value = 100;
        this.doOnChange();
        return;
      }

      const fromHSV = (h, s, v) => {
        this._hue = Math.max(0, Math.min(360, h));
        this._saturation = Math.max(0, Math.min(100, s));
        this._value = Math.max(0, Math.min(100, v));
        this.doOnChange();
      };

      if (value.indexOf('hsl') !== -1) {
        const parts = value.replace(/hsla|hsl|\(|\)/gm, '').split(/\s|,/g).filter(val => val !== '').map((val, index) => index > 2 ? parseFloat(val) : parseInt(val, 10));

        if (parts.length === 4) {
          this._alpha = Math.floor(parseFloat(parts[3]) * 100);
        } else if (parts.length === 3) {
          this._alpha = 100;
        }

        if (parts.length >= 3) {
          const {
            h,
            s,
            v
          } = hsl2hsv(parts[0], parts[1], parts[2]);
          fromHSV(h, s, v);
        }
      } else if (value.indexOf('hsv') !== -1) {
        const parts = value.replace(/hsva|hsv|\(|\)/gm, '').split(/\s|,/g).filter(val => val !== '').map((val, index) => index > 2 ? parseFloat(val) : parseInt(val, 10));

        if (parts.length === 4) {
          this._alpha = Math.floor(parseFloat(parts[3]) * 100);
        } else if (parts.length === 3) {
          this._alpha = 100;
        }

        if (parts.length >= 3) {
          fromHSV(parts[0], parts[1], parts[2]);
        }
      } else if (value.indexOf('rgb') !== -1) {
        const parts = value.replace(/rgba|rgb|\(|\)/gm, '').split(/\s|,/g).filter(val => val !== '').map((val, index) => index > 2 ? parseFloat(val) : parseInt(val, 10));

        if (parts.length === 4) {
          this._alpha = Math.floor(parseFloat(parts[3]) * 100);
        } else if (parts.length === 3) {
          this._alpha = 100;
        }

        if (parts.length >= 3) {
          const {
            h,
            s,
            v
          } = rgb2hsv(parts[0], parts[1], parts[2]);
          fromHSV(h, s, v);
        }
      } else if (value.indexOf('#') !== -1) {
        const hex = value.replace('#', '').trim();
        if (!/^(?:[0-9a-fA-F]{3}){1,2}$/.test(hex)) return;
        let r, g, b;

        if (hex.length === 3) {
          r = parseHexChannel(hex[0] + hex[0]);
          g = parseHexChannel(hex[1] + hex[1]);
          b = parseHexChannel(hex[2] + hex[2]);
        } else if (hex.length === 6 || hex.length === 8) {
          r = parseHexChannel(hex.substring(0, 2));
          g = parseHexChannel(hex.substring(2, 4));
          b = parseHexChannel(hex.substring(4, 6));
        }

        if (hex.length === 8) {
          this._alpha = Math.floor(parseHexChannel(hex.substring(6)) / 255 * 100);
        } else if (hex.length === 3 || hex.length === 6) {
          this._alpha = 100;
        }

        const {
          h,
          s,
          v
        } = rgb2hsv(r, g, b);
        fromHSV(h, s, v);
      }
    }

    compare(color) {
      return Math.abs(color._hue - this._hue) < 2 && Math.abs(color._saturation - this._saturation) < 1 && Math.abs(color._value - this._value) < 1 && Math.abs(color._alpha - this._alpha) < 1;
    }

    doOnChange() {
      const {
        _hue,
        _saturation,
        _value,
        _alpha,
        format
      } = this;

      if (this.enableAlpha) {
        switch (format) {
          case 'hsl':
            const hsl = hsv2hsl(_hue, _saturation / 100, _value / 100);
            this.value = `hsla(${_hue}, ${Math.round(hsl[1] * 100)}%, ${Math.round(hsl[2] * 100)}%, ${_alpha / 100})`;
            break;

          case 'hsv':
            this.value = `hsva(${_hue}, ${Math.round(_saturation)}%, ${Math.round(_value)}%, ${_alpha / 100})`;
            break;

          default:
            const {
              r,
              g,
              b
            } = hsv2rgb(_hue, _saturation, _value);
            this.value = `rgba(${r}, ${g}, ${b}, ${_alpha / 100})`;
        }
      } else {
        switch (format) {
          case 'hsl':
            const hsl = hsv2hsl(_hue, _saturation / 100, _value / 100);
            this.value = `hsl(${_hue}, ${Math.round(hsl[1] * 100)}%, ${Math.round(hsl[2] * 100)}%)`;
            break;

          case 'hsv':
            this.value = `hsv(${_hue}, ${Math.round(_saturation)}%, ${Math.round(_value)}%)`;
            break;

          case 'rgb':
            const {
              r,
              g,
              b
            } = hsv2rgb(_hue, _saturation, _value);
            this.value = `rgb(${r}, ${g}, ${b})`;
            break;

          default:
            this.value = toHex(hsv2rgb(_hue, _saturation, _value));
        }
      }
    }

  }

  let isDragging = false;
  function draggable (element, options) {
    // if (Vue.prototype.$isServer) return
    const moveFn = function (event) {
      if (options.drag) {
        options.drag(event);
      }
    };

    const upFn = function (event) {
      document.removeEventListener('mousemove', moveFn);
      document.removeEventListener('mouseup', upFn);
      document.onselectstart = null;
      document.ondragstart = null;
      isDragging = false;

      if (options.end) {
        options.end(event);
      }
    };

    element.addEventListener('mousedown', function (event) {
      if (isDragging) return;

      document.onselectstart = function () {
        return false;
      };

      document.ondragstart = function () {
        return false;
      };

      document.addEventListener('mousemove', moveFn);
      document.addEventListener('mouseup', upFn);
      isDragging = true;

      if (options.start) {
        options.start(event);
      }
    });
  }

  var script$10 = {
    name: 'el-sl-panel',
    props: {
      color: {
        required: true
      }
    },

    setup(props) {
      const state = vue.reactive({
        cursorTop: 0,
        cursorLeft: 0,
        background: 'hsl(0, 100%, 50%)'
      });
      const instance = vue.getCurrentInstance();
      const colorValue = vue.computed(() => {
        const hue = props.color.get('hue');
        const value = props.color.get('value');
        return {
          hue,
          value
        };
      });
      vue.watch(colorValue, update);
      vue.onMounted(() => {
        draggable(instance.refs.panel, {
          drag: handleDrag,
          end: handleDrag
        });
        update();
      });

      function update() {
        const saturation = props.color.get('saturation');
        const value = props.color.get('value');
        const el = instance.refs.panel;
        const {
          clientWidth: width,
          clientHeight: height
        } = el;
        state.cursorLeft = saturation * width / 100;
        state.cursorTop = (100 - value) * height / 100;
        state.background = 'hsl(' + props.color.get('hue') + ', 100%, 50%)';
      }

      function handleDrag(event) {
        const el = instance.refs.panel;
        const rect = el.getBoundingClientRect();
        let left = event.clientX - rect.left;
        let top = event.clientY - rect.top;
        left = Math.max(0, left);
        left = Math.min(left, rect.width);
        top = Math.max(0, top);
        top = Math.min(top, rect.height);
        state.cursorLeft = left;
        state.cursorTop = top;
        props.color.set({
          saturation: left / rect.width * 100,
          value: 100 - top / rect.height * 100
        });
      }

      return { ...vue.toRefs(state),
        handleDrag,
        update
      };
    }

  };

  const _hoisted_1$F = /*#__PURE__*/vue.createVNode("div", {
    class: "el-color-svpanel__white"
  }, null, -1
  /* HOISTED */
  );

  const _hoisted_2$r = /*#__PURE__*/vue.createVNode("div", {
    class: "el-color-svpanel__black"
  }, null, -1
  /* HOISTED */
  );

  const _hoisted_3$m = /*#__PURE__*/vue.createVNode("div", null, null, -1
  /* HOISTED */
  );

  function render$T(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("div", {
      class: "el-color-svpanel",
      ref: "panel",
      style: {
        backgroundColor: _ctx.background
      }
    }, [_hoisted_1$F, _hoisted_2$r, vue.createVNode("div", {
      class: "el-color-svpanel__cursor",
      style: {
        top: _ctx.cursorTop + 'px',
        left: _ctx.cursorLeft + 'px'
      }
    }, [_hoisted_3$m], 4
    /* STYLE */
    )], 4
    /* STYLE */
    );
  }

  script$10.render = render$T;
  script$10.__file = "packages/color-picker/src/components/sv-panel.vue";

  var script$$ = {
    name: 'el-color-hue-slider',
    props: {
      color: {
        required: true
      },
      vertical: Boolean
    },

    setup(props) {
      const instance = vue.getCurrentInstance();
      const state = vue.reactive({
        thumbLeft: 0,
        thumbTop: 0
      });
      const hueValue = vue.computed(() => {
        return props.color.get('hue');
      });
      vue.watch(hueValue, update);

      function handleClick(event) {
        const {
          thumb
        } = state;
        const target = event.target;

        if (target !== thumb) {
          handleDrag(event);
        }
      }

      function handleDrag(event) {
        const rect = instance.proxy.$el.getBoundingClientRect();
        const {
          thumb
        } = instance.refs;
        let hue;

        if (!props.vertical) {
          let left = event.clientX - rect.left;
          left = Math.min(left, rect.width - thumb.offsetWidth / 2);
          left = Math.max(thumb.offsetWidth / 2, left);
          hue = Math.round((left - thumb.offsetWidth / 2) / (rect.width - thumb.offsetWidth) * 360);
        } else {
          let top = event.clientY - rect.top;
          top = Math.min(top, rect.height - thumb.offsetHeight / 2);
          top = Math.max(thumb.offsetHeight / 2, top);
          hue = Math.round((top - thumb.offsetHeight / 2) / (rect.height - thumb.offsetHeight) * 360);
        }

        props.color.set('hue', hue);
      }

      function getThumbLeft() {
        if (props.vertical) return 0;
        const el = instance.proxy.$el;
        const hue = props.color.get('hue');
        if (!el) return 0;
        const thumb = instance.refs.thumb;
        return Math.round(hue * (el.offsetWidth - thumb.offsetWidth / 2) / 360);
      }

      function getThumbTop() {
        if (!props.vertical) return 0;
        const el = instance.proxy.$el;
        const hue = props.color.get('hue');
        if (!el) return 0;
        const thumb = instance.refs.thumb;
        return Math.round(hue * (el.offsetHeight - thumb.offsetHeight / 2) / 360);
      }

      function update() {
        state.thumbLeft = getThumbLeft();
        state.thumbTop = getThumbTop();
      }

      vue.onMounted(() => {
        const {
          bar,
          thumb
        } = instance.refs;
        const dragConfig = {
          drag: event => handleDrag(event),
          end: event => handleDrag(event)
        };
        draggable(bar, dragConfig);
        draggable(thumb, dragConfig);
        update();
      });
      return { ...vue.toRefs(state),
        handleClick,
        update
      };
    }

  };

  function render$S(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("div", {
      class: ["el-color-hue-slider", {
        'is-vertical': $props.vertical
      }]
    }, [vue.createVNode("div", {
      class: "el-color-hue-slider__bar",
      onClick: _cache[1] || (_cache[1] = (...args) => $setup.handleClick && $setup.handleClick(...args)),
      ref: "bar"
    }, null, 512
    /* NEED_PATCH */
    ), vue.createVNode("div", {
      class: "el-color-hue-slider__thumb",
      style: {
        left: _ctx.thumbLeft + 'px',
        top: _ctx.thumbTop + 'px'
      },
      ref: "thumb"
    }, null, 4
    /* STYLE */
    )], 2
    /* CLASS */
    );
  }

  script$$.render = render$S;
  script$$.__file = "packages/color-picker/src/components/hue-slider.vue";

  var script$_ = {
    name: 'el-color-alpha-slider',
    props: {
      color: {
        required: true
      },
      vertical: Boolean
    },

    setup(props) {
      const state = vue.reactive({
        thumbLeft: 0,
        thumbTop: 0,
        background: null
      });
      const instance = vue.getCurrentInstance();
      vue.watch(props.color, update); // watch(() => props.color.value, update)

      vue.onMounted(() => {
        const {
          bar,
          thumb
        } = instance.refs;
        const dragConfig = {
          drag: event => {
            handleDrag(event);
          },
          end: event => {
            handleDrag(event);
          }
        };
        draggable(bar, dragConfig);
        draggable(thumb, dragConfig);
        update();
      });

      function handleClick(event) {
        const thumb = instance.refs.thumb;
        const target = event.target;

        if (target !== thumb) {
          handleDrag(event);
        }
      }

      function handleDrag(event) {
        const rect = instance.proxy.$el.getBoundingClientRect();
        const {
          thumb
        } = instance.refs;

        if (!props.vertical) {
          let left = event.clientX - rect.left;
          left = Math.max(thumb.offsetWidth / 2, left);
          left = Math.min(left, rect.width - thumb.offsetWidth / 2);
          props.color.set('alpha', Math.round((left - thumb.offsetWidth / 2) / (rect.width - thumb.offsetWidth) * 100));
        } else {
          let top = event.clientY - rect.top;
          top = Math.max(thumb.offsetHeight / 2, top);
          top = Math.min(top, rect.height - thumb.offsetHeight / 2);
          props.color.set('alpha', Math.round((top - thumb.offsetHeight / 2) / (rect.height - thumb.offsetHeight) * 100));
        }
      }

      function getThumbLeft() {
        if (props.vertical) return 0;
        const el = instance.proxy.$el;
        const alpha = props.color._alpha;
        if (!el) return 0;
        const thumb = instance.refs.thumb;
        return Math.round(alpha * (el.offsetWidth - thumb.offsetWidth / 2) / 100);
      }

      function getThumbTop() {
        if (!props.vertical) return 0;
        const el = instance.proxy.$el;
        const alpha = props.color._alpha;
        if (!el) return 0;
        const thumb = instance.refs.thumb;
        return Math.round(alpha * (el.offsetHeight - thumb.offsetHeight / 2) / 100);
      }

      function getBackground() {
        if (props.color && props.color.value) {
          const {
            r,
            g,
            b
          } = props.color.toRgb();
          return `linear-gradient(to right, rgba(${r}, ${g}, ${b}, 0) 0%, rgba(${r}, ${g}, ${b}, 1) 100%)`;
        }

        return null;
      }

      function update() {
        state.thumbLeft = getThumbLeft();
        state.thumbTop = getThumbTop();
        state.background = getBackground();
      }

      return { ...vue.toRefs(state),
        handleClick,
        update
      };
    }

  };

  function render$R(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("div", {
      class: ["el-color-alpha-slider", {
        'is-vertical': $props.vertical
      }]
    }, [vue.createVNode("div", {
      class: "el-color-alpha-slider__bar",
      onClick: _cache[1] || (_cache[1] = (...args) => $setup.handleClick && $setup.handleClick(...args)),
      ref: "bar",
      style: {
        background: _ctx.background
      }
    }, null, 4
    /* STYLE */
    ), vue.createVNode("div", {
      class: "el-color-alpha-slider__thumb",
      ref: "thumb",
      style: {
        left: _ctx.thumbLeft + 'px',
        top: _ctx.thumbTop + 'px'
      }
    }, null, 4
    /* STYLE */
    )], 2
    /* CLASS */
    );
  }

  script$_.render = render$R;
  script$_.__file = "packages/color-picker/src/components/alpha-slider.vue";

  var script$Z = {
    props: {
      colors: {
        type: Array,
        required: true
      },
      color: {
        required: true
      }
    },

    setup(props) {
      const state = vue.reactive({
        rgbaColors: parseColors(props.colors, props.color)
      });
      const currentColor = vue.inject('currentColor');
      vue.watch(currentColor, val => {
        const color = new Color();
        color.fromString(val);
        state.rgbaColors.forEach(item => {
          item.selected = color.compare(item);
        });
      });
      vue.watch(props.colors, newVal => {
        state.rgbaColors = parseColors(newVal, props.color);
      });
      vue.watch(props.color, newVal => {
        state.rgbaColors = parseColors(props.colors, newVal);
      });

      function handleSelect(index) {
        props.color.fromString(props.colors[index]);
      }

      function parseColors(colors, color) {
        return colors.map(value => {
          const c = new Color();
          c.enableAlpha = true;
          c.format = 'rgba';
          c.fromString(value);
          c.selected = c.value === color.value;
          return c;
        });
      }

      return { ...vue.toRefs(state),
        handleSelect
      };
    }

  };

  const _hoisted_1$E = {
    class: "el-color-predefine"
  };
  const _hoisted_2$q = {
    class: "el-color-predefine__colors"
  };
  function render$Q(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("div", _hoisted_1$E, [vue.createVNode("div", _hoisted_2$q, [(vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList(_ctx.rgbaColors, (item, index) => {
      return vue.openBlock(), vue.createBlock("div", {
        class: ["el-color-predefine__color-selector", {
          selected: item.selected,
          'is-alpha': item._alpha < 100
        }],
        key: $props.colors[index],
        onClick: $event => $setup.handleSelect(index)
      }, [vue.createVNode("div", {
        style: {
          'background-color': item.value
        }
      }, null, 4
      /* STYLE */
      )], 10
      /* CLASS, PROPS */
      , ["onClick"]);
    }), 128
    /* KEYED_FRAGMENT */
    ))])]);
  }

  script$Z.render = render$Q;
  script$Z.__file = "packages/color-picker/src/components/predefine.vue";

  var script$Y = {
    name: 'el-color-picker-dropdown',
    // mixins: [Popper, Locale],
    components: {
      SvPanel: script$10,
      HueSlider: script$$,
      AlphaSlider: script$_,
      ElInput: script$1l,
      ElButton: script$1u,
      Predefine: script$Z
    },
    emits: ['pick', 'clear', 'update:modelValue', 'created'],
    props: { ...popperProps,
      disabled: {
        type: Boolean,
        default: false
      },
      color: {
        required: true
      },
      showAlpha: Boolean,
      predefine: Array,
      popperClass: String
    },

    setup(props, context) {
      const instance = vue.getCurrentInstance();
      const state = vue.reactive({
        customInput: '',
        popperElm: null,
        referenceElm: null,
        alpha: null
      });
      const referenceState = vue.inject('referenceState');
      const popperState = usePopper(props, context, { ...vue.toRefs(state)
      });
      const currentColor = vue.computed(() => {
        const parent = instance.parent;
        return !parent || !parent.proxy.showPanelColor ? '' : parent.proxy.color.value;
      });
      vue.provide('currentColor', currentColor);
      vue.watch(popperState.showPopper, val => {
        if (val === true) {
          vue.nextTick(() => {
            const {
              sl,
              hue,
              alpha
            } = instance.refs;
            sl && sl.update();
            hue && hue.update();
            alpha && alpha.update();
          });
        }
      });
      vue.watch(currentColor, val => {
        state.customInput = val;
      }, {
        immediate: true
      });
      vue.onMounted(() => {
        referenceState.popperElm = state.popperElm;
        state.referenceElm = referenceState.referenceElm;
      });

      function confirmValue() {
        context.emit('pick');
      }

      function handleConfirm() {
        props.color.fromString(state.customInput);
      }

      const t = useLocale();
      return { ...popperState,
        ...vue.toRefs(state),
        confirmValue,
        handleConfirm,
        t
      };
    }

  };

  const _hoisted_1$D = {
    class: "el-color-dropdown__main-wrapper"
  };
  const _hoisted_2$p = {
    class: "el-color-dropdown__btns"
  };
  const _hoisted_3$l = {
    class: "el-color-dropdown__value"
  };
  function render$P(_ctx, _cache, $props, $setup, $data, $options) {
    const _component_hue_slider = vue.resolveComponent("hue-slider");

    const _component_sv_panel = vue.resolveComponent("sv-panel");

    const _component_alpha_slider = vue.resolveComponent("alpha-slider");

    const _component_predefine = vue.resolveComponent("predefine");

    const _component_el_input = vue.resolveComponent("el-input");

    const _component_el_button = vue.resolveComponent("el-button");

    return vue.openBlock(), vue.createBlock(vue.Teleport, {
      to: "body"
    }, [vue.createVNode(vue.Transition, {
      name: "el-zoom-in-top",
      onAfterLeaveFrom: _ctx.doDestroy
    }, {
      default: vue.withCtx(() => [vue.withDirectives(vue.createVNode("div", {
        class: ["el-color-dropdown", ['el-color-picker__panel', $props.popperClass || '']],
        ref: "popperElm"
      }, [vue.createVNode("div", _hoisted_1$D, [vue.createVNode(_component_hue_slider, {
        ref: "hue",
        color: $props.color,
        vertical: "",
        style: {
          "float": "right"
        }
      }, null, 8
      /* PROPS */
      , ["color"]), vue.createVNode(_component_sv_panel, {
        ref: "sl",
        color: $props.color
      }, null, 8
      /* PROPS */
      , ["color"])]), $props.showAlpha ? (vue.openBlock(), vue.createBlock(_component_alpha_slider, {
        key: 0,
        ref: "alpha",
        color: $props.color
      }, null, 8
      /* PROPS */
      , ["color"])) : vue.createCommentVNode("v-if", true), $props.predefine ? (vue.openBlock(), vue.createBlock(_component_predefine, {
        key: 1,
        color: $props.color,
        colors: $props.predefine
      }, null, 8
      /* PROPS */
      , ["color", "colors"])) : vue.createCommentVNode("v-if", true), vue.createVNode("div", _hoisted_2$p, [vue.createVNode("span", _hoisted_3$l, [vue.createVNode(_component_el_input, {
        modelValue: _ctx.customInput,
        "onUpdate:modelValue": _cache[1] || (_cache[1] = $event => _ctx.customInput = $event),
        onKeyup: vue.withKeys($setup.handleConfirm, ["enter"]),
        onBlur: $setup.handleConfirm,
        "validate-event": false,
        size: "mini"
      }, null, 8
      /* PROPS */
      , ["modelValue", "onKeyup", "onBlur"])]), vue.createVNode(_component_el_button, {
        size: "mini",
        type: "text",
        class: "el-color-dropdown__link-btn",
        onClick: _cache[2] || (_cache[2] = $event => _ctx.$emit('clear'))
      }, {
        default: vue.withCtx(() => [vue.createTextVNode(vue.toDisplayString($setup.t('el.colorpicker.clear')), 1
        /* TEXT */
        )]),
        _: 1
        /* STABLE */

      }), vue.createVNode(_component_el_button, {
        plain: "",
        size: "mini",
        class: "el-color-dropdown__btn",
        onClick: $setup.confirmValue
      }, {
        default: vue.withCtx(() => [vue.createTextVNode(vue.toDisplayString($setup.t('el.colorpicker.confirm')), 1
        /* TEXT */
        )]),
        _: 1
        /* STABLE */

      }, 8
      /* PROPS */
      , ["onClick"])])], 2
      /* CLASS */
      ), [[vue.vShow, _ctx.showPopper]])]),
      _: 1
      /* STABLE */

    }, 8
    /* PROPS */
    , ["onAfterLeaveFrom"])]);
  }

  script$Y.render = render$P;
  script$Y.__file = "packages/color-picker/src/components/picker-dropdown.vue";

  var script$X = {
    name: 'ElColorPicker',
    props: {
      modelValue: String,
      showAlpha: Boolean,
      colorFormat: String,
      disabled: Boolean,
      size: String,
      popperClass: String,
      predefine: Array
    },
    emits: ['active-change', 'input', 'change', 'update:modelValue'],

    setup(props, context) {
      const color = new Color({
        enableAlpha: props.showAlpha,
        format: props.colorFormat
      });
      const state = vue.reactive({
        color,
        showPicker: false,
        showPanelColor: false,
        popperElm: null,
        referenceElm: null
      });
      vue.provide('referenceState', state);
      vue.inject('elForm', {});
      const {
        dispatch
      } = useEmitter();
      const elFormItem = vue.inject('elFormItem', {});
      const elForm = vue.inject('elForm', {});
      const displayedColor = vue.computed(() => {
        if (!props.modelValue && !state.showPanelColor) {
          return 'transparent';
        }

        return displayedRgb(state.color, props.showAlpha);
      });

      const _elFormItemSize = vue.computed(() => {
        return (elFormItem || {}).elFormItemSize;
      });

      const colorSize = vue.computed(() => {
        return props.size || _elFormItemSize.value || (context.$ELEMENT || {}).size;
      });
      const colorDisabled = vue.computed(() => {
        return props.disabled || (elForm || {}).disabled;
      });
      vue.watch(() => props.modelValue, val => {
        if (!val) {
          state.showPanelColor = false;
        } else if (val && val !== state.color.value) {
          state.color.fromString(val);
        }
      });
      vue.watch(state.color, () => state.showPanelColor = true, {
        deep: true
      });
      vue.watch(displayedColor, val => {
        if (!state.showPicker) return;
        const currentValueColor = new Color({
          enableAlpha: props.showAlpha,
          format: props.colorFormat
        });

        if (val !== currentValueColor) {
          context.emit('active-change', val);
        }
      });
      vue.onMounted(() => {
        const value = props.modelValue;

        if (value) {
          state.color.fromString(value);
        }
      });

      function displayedRgb(color, showAlpha) {
        if (!(color instanceof Color)) {
          throw Error('color should be instance of Color Class');
        }

        const {
          r,
          g,
          b
        } = color.toRgb();
        return showAlpha ? `rgba(${r}, ${g}, ${b}, ${color.get('alpha') / 100})` : `rgb(${r}, ${g}, ${b})`;
      }

      const handleTrigger = () => {
        if (colorDisabled.value) return;
        state.showPicker = !state.showPicker;
      };

      const confirmValue = () => {
        const value = state.color.value;
        context.emit('update:modelValue', value);
        context.emit('change', value);
        dispatch('ElFormItem', 'el.form.change', value);
        state.showPicker = false;
      };

      const clearValue = () => {
        context.emit('update:modelValue', null);
        context.emit('change', null);

        if (props.modelValue !== null) {
          dispatch('ElFormItem', 'el.form.change', null);
        }

        state.showPanelColor = false;
        state.showPicker = false;
        resetColor();
      };

      const hide = () => {
        state.showPicker = false;
        resetColor();
      };

      const resetColor = () => {
        vue.nextTick(() => {
          if (props.modelValue) {
            state.color.fromString(props.modelValue);
          } else {
            state.showPanelColor = false;
          }
        });
      };

      return { ...vue.toRefs(state),
        handleTrigger,
        confirmValue,
        clearValue,
        hide,
        displayedRgb,
        colorSize,
        colorDisabled,
        displayedColor
      };
    },

    directives: {
      Clickoutside
    },
    components: {
      PickerDropdown: script$Y
    }
  };

  const _hoisted_1$C = {
    key: 0,
    class: "el-color-picker__mask"
  };
  const _hoisted_2$o = {
    key: 0,
    class: "el-color-picker__empty el-icon-close"
  };
  const _hoisted_3$k = {
    class: "el-color-picker__icon el-icon-arrow-down"
  };
  function render$O(_ctx, _cache, $props, $setup, $data, $options) {
    const _component_picker_dropdown = vue.resolveComponent("picker-dropdown");

    const _directive_clickoutside = vue.resolveDirective("clickoutside");

    return vue.withDirectives((vue.openBlock(), vue.createBlock("div", {
      class: ['el-color-picker', $setup.colorDisabled ? 'is-disabled' : '', $setup.colorSize ? `el-color-picker--${$setup.colorSize}` : ''],
      ref: "referenceElm"
    }, [$setup.colorDisabled ? (vue.openBlock(), vue.createBlock("div", _hoisted_1$C)) : vue.createCommentVNode("v-if", true), vue.createVNode("div", {
      class: "el-color-picker__trigger",
      onClick: _cache[1] || (_cache[1] = (...args) => $setup.handleTrigger && $setup.handleTrigger(...args))
    }, [vue.createVNode("span", {
      class: ["el-color-picker__color", {
        'is-alpha': $props.showAlpha
      }]
    }, [vue.createVNode("span", {
      class: "el-color-picker__color-inner",
      style: {
        backgroundColor: $setup.displayedColor
      }
    }, null, 4
    /* STYLE */
    ), !$props.modelValue && !_ctx.showPanelColor ? (vue.openBlock(), vue.createBlock("span", _hoisted_2$o)) : vue.createCommentVNode("v-if", true)], 2
    /* CLASS */
    ), vue.withDirectives(vue.createVNode("span", _hoisted_3$k, null, 512
    /* NEED_PATCH */
    ), [[vue.vShow, $props.modelValue || _ctx.showPanelColor]])]), vue.createVNode(_component_picker_dropdown, {
      ref: "dropdown",
      popperClass: $props.popperClass,
      modelValue: _ctx.showPicker,
      "onUpdate:modelValue": _cache[2] || (_cache[2] = $event => _ctx.showPicker = $event),
      onPick: $setup.confirmValue,
      onClear: $setup.clearValue,
      color: _ctx.color,
      "show-alpha": $props.showAlpha,
      predefine: $props.predefine
    }, null, 8
    /* PROPS */
    , ["popperClass", "modelValue", "onPick", "onClear", "color", "show-alpha", "predefine"])], 2
    /* CLASS */
    )), [[_directive_clickoutside, $setup.hide]]);
  }

  script$X.render = render$O;
  script$X.__file = "packages/color-picker/src/main.vue";

  /* istanbul ignore next */

  script$X.install = function (app) {
    app.component(script$X.name, script$X);
  };

  var script$W = {
    name: 'OptionContent',
    props: {
      option: Object,
      renderContent: Function,
      labelProp: String,
      keyProp: String
    },

    setup() {
      const defaultScopedSlots = vue.inject('defaultScopedSlots');
      return {
        defaultScopedSlots
      };
    },

    render() {
      return this.renderContent ? this.renderContent(vue.h, this.option) : this.defaultScopedSlots ? this.defaultScopedSlots({
        option: this.option
      }) : vue.h('span', this.option[this.labelProp] || this.option[this.keyProp]);
    }

  };

  script$W.__file = "packages/transfer/src/OptionContent.vue";

  var script$V = {
    name: 'ElTransferPanel',
    componentName: 'ElTransferPanel',
    emits: ['checked-change'],
    components: {
      ElCheckboxGroup: script$1m,
      ElCheckbox: script$1o,
      ElInput: script$1l,
      OptionContent: script$W
    },
    props: {
      data: {
        type: Array,

        default() {
          return [];
        }

      },
      renderContent: Function,
      placeholder: String,
      title: String,
      filterable: Boolean,
      format: Object,
      filterMethod: Function,
      defaultChecked: Array,
      props: Object
    },

    setup(props, {
      emit,
      slots
    }) {
      const t = useLocale();
      const state = vue.reactive({
        checked: [],
        allChecked: false,
        query: '',
        checkChangeByUser: true
      });
      const {
        filteredData,
        labelProp,
        keyProp,
        checkableData,
        checkedSummary,
        isIndeterminate,
        hasNoMatch,
        disabledProp,
        hasFooter
      } = useTransferPanelData(props, state, slots, emit);

      const handleAllCheckedChange = value => {
        state.checked = value ? checkableData.value.map(item => item[keyProp.value]) : [];
      };

      return {
        t,
        ...vue.toRefs(state),
        filteredData,
        labelProp,
        keyProp,
        checkedSummary,
        isIndeterminate,
        hasNoMatch,
        disabledProp,
        hasFooter,
        handleAllCheckedChange
      };
    }

  };

  const useTransferPanelData = (props, state, slots, emit) => {
    const filteredData = vue.computed(() => {
      const {
        data,
        filterMethod
      } = props;
      return data.filter(item => {
        if (typeof filterMethod === 'function') {
          return filterMethod(state.query, item);
        } else {
          const label = item[labelProp.value] || item[keyProp.value].toString();
          return label.toLowerCase().indexOf(state.query.toLowerCase()) > -1;
        }
      });
    });
    const labelProp = vue.computed(() => {
      const {
        props: p
      } = props;
      return p.label || 'label';
    });
    const keyProp = vue.computed(() => {
      const {
        props: p
      } = props;
      return p.key || 'key';
    });
    const checkableData = vue.computed(() => filteredData.value.filter(item => !item[disabledProp.value]));
    const checkedSummary = vue.computed(() => {
      const {
        data,
        format
      } = props;
      const checkedLength = state.checked.length;
      const dataLength = data.length;
      const {
        noChecked,
        hasChecked
      } = format;

      if (noChecked && hasChecked) {
        return checkedLength > 0 ? hasChecked.replace(/\${checked}/g, checkedLength).replace(/\${total}/g, dataLength) : noChecked.replace(/\${total}/g, dataLength);
      } else {
        return `${checkedLength}/${dataLength}`;
      }
    });
    const isIndeterminate = vue.computed(() => {
      const checkedLength = state.checked.length;
      return checkedLength > 0 && checkedLength < checkableData.value.length;
    });
    const hasNoMatch = vue.computed(() => state.query.length > 0 && filteredData.value.length === 0);
    const disabledProp = vue.computed(() => props.props.disabled || 'disabled');
    const hasFooter = vue.computed(() => !!slots.default()[0].children.length);

    const updateAllChecked = () => {
      const checkableDataKeys = checkableData.value.map(item => item[keyProp.value]);
      state.allChecked = checkableDataKeys.length > 0 && checkableDataKeys.every(item => state.checked.indexOf(item) > -1);
    };

    vue.watch(() => checkableData.value, () => updateAllChecked());
    vue.watch(() => props.data, () => {
      const checked = [];
      const filteredDataKeys = filteredData.value.map(item => item[keyProp.value]);
      state.checked.forEach(item => {
        if (filteredDataKeys.indexOf(item) > -1) {
          checked.push(item);
        }
      });
      state.checkChangeByUser = false;
      state.checked = checked;
    });
    vue.watch(() => state.checked, (val, oldVal) => {
      updateAllChecked();

      if (state.checkChangeByUser) {
        const movedKeys = val.concat(oldVal).filter(v => val.indexOf(v) === -1 || oldVal.indexOf(v) === -1);
        emit('checked-change', val, movedKeys);
      } else {
        emit('checked-change', val);
        state.checkChangeByUser = true;
      }
    }, {
      deep: true
    });
    vue.watch(() => props.defaultChecked, (val, oldVal) => {
      if (oldVal && val.length === oldVal.length && val.every(item => oldVal.indexOf(item) > -1)) return;
      const checked = [];
      const checkableDataKeys = checkableData.value.map(item => item[keyProp.value]);
      val.forEach(item => {
        if (checkableDataKeys.indexOf(item) > -1) {
          checked.push(item);
        }
      });
      state.checkChangeByUser = false;
      state.checked = checked;
    }, {
      immediate: true
    });
    return {
      filteredData,
      labelProp,
      keyProp,
      checkableData,
      checkedSummary,
      isIndeterminate,
      hasNoMatch,
      disabledProp,
      hasFooter,
      updateAllChecked
    };
  };

  const _hoisted_1$B = {
    class: "el-transfer-panel"
  };
  const _hoisted_2$n = {
    class: "el-transfer-panel__header"
  };
  const _hoisted_3$j = {
    class: "el-transfer-panel__filter"
  };

  const _hoisted_4$d = /*#__PURE__*/vue.createVNode("i", {
    class: ['el-input__icon', 'el-icon-search']
  }, null, -1
  /* HOISTED */
  );

  const _hoisted_5$9 = {
    key: 0,
    class: "el-transfer-panel__footer"
  };
  function render$N(_ctx, _cache, $props, $setup, $data, $options) {
    const _component_el_checkbox = vue.resolveComponent("el-checkbox");

    const _component_el_input = vue.resolveComponent("el-input");

    const _component_option_content = vue.resolveComponent("option-content");

    const _component_el_checkbox_group = vue.resolveComponent("el-checkbox-group");

    return vue.openBlock(), vue.createBlock("div", _hoisted_1$B, [vue.createVNode("p", _hoisted_2$n, [vue.createVNode(_component_el_checkbox, {
      modelValue: _ctx.allChecked,
      "onUpdate:modelValue": _cache[1] || (_cache[1] = $event => _ctx.allChecked = $event),
      onChange: $setup.handleAllCheckedChange,
      indeterminate: $setup.isIndeterminate
    }, {
      default: vue.withCtx(() => [vue.createTextVNode(vue.toDisplayString($props.title) + " ", 1
      /* TEXT */
      ), vue.createVNode("span", null, vue.toDisplayString($setup.checkedSummary), 1
      /* TEXT */
      )]),
      _: 1
      /* STABLE */

    }, 8
    /* PROPS */
    , ["modelValue", "onChange", "indeterminate"])]), vue.createVNode("div", {
      class: ['el-transfer-panel__body', $setup.hasFooter ? 'is-with-footer' : '']
    }, [vue.createVNode("div", _hoisted_3$j, [$props.filterable ? (vue.openBlock(), vue.createBlock(_component_el_input, {
      key: 0,
      modelValue: _ctx.query,
      "onUpdate:modelValue": _cache[2] || (_cache[2] = $event => _ctx.query = $event),
      size: "small",
      clearable: "",
      placeholder: $props.placeholder
    }, {
      prefix: vue.withCtx(() => [_hoisted_4$d]),
      _: 1
      /* STABLE */

    }, 8
    /* PROPS */
    , ["modelValue", "placeholder"])) : vue.createCommentVNode("v-if", true)]), vue.withDirectives(vue.createVNode(_component_el_checkbox_group, {
      modelValue: _ctx.checked,
      "onUpdate:modelValue": _cache[3] || (_cache[3] = $event => _ctx.checked = $event),
      class: [{
        'is-filterable': $props.filterable
      }, "el-transfer-panel__list"]
    }, {
      default: vue.withCtx(() => [(vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList($setup.filteredData, item => {
        return vue.openBlock(), vue.createBlock(_component_el_checkbox, {
          class: "el-transfer-panel__item",
          label: item[$setup.keyProp],
          disabled: item[$setup.disabledProp],
          key: item[$setup.keyProp]
        }, {
          default: vue.withCtx(() => [vue.createVNode(_component_option_content, {
            option: item,
            "render-content": $props.renderContent,
            "label-prop": $setup.labelProp,
            "key-prop": $setup.keyProp
          }, null, 8
          /* PROPS */
          , ["option", "render-content", "label-prop", "key-prop"])]),
          _: 2
          /* DYNAMIC */

        }, 1032
        /* PROPS, DYNAMIC_SLOTS */
        , ["label", "disabled"]);
      }), 128
      /* KEYED_FRAGMENT */
      ))]),
      _: 1
      /* STABLE */

    }, 8
    /* PROPS */
    , ["modelValue", "class"]), [[vue.vShow, !$setup.hasNoMatch && $props.data.length > 0]]), vue.withDirectives(vue.createVNode("p", {
      class: "el-transfer-panel__empty"
    }, vue.toDisplayString($setup.t('el.transfer.noMatch')), 513
    /* TEXT, NEED_PATCH */
    ), [[vue.vShow, $setup.hasNoMatch]]), vue.withDirectives(vue.createVNode("p", {
      class: "el-transfer-panel__empty"
    }, vue.toDisplayString($setup.t('el.transfer.noData')), 513
    /* TEXT, NEED_PATCH */
    ), [[vue.vShow, $props.data.length === 0 && !$setup.hasNoMatch]])], 2
    /* CLASS */
    ), $setup.hasFooter ? (vue.openBlock(), vue.createBlock("p", _hoisted_5$9, [vue.renderSlot(_ctx.$slots, "default")])) : vue.createCommentVNode("v-if", true)]);
  }

  script$V.render = render$N;
  script$V.__file = "packages/transfer/src/TransferPanel.vue";

  var script$U = {
    name: 'ElTransfer',
    emits: ['update:modelValue', 'change', 'left-check-change', 'right-check-change'],
    components: {
      TransferPanel: script$V,
      ElButton: script$1u
    },
    props: {
      data: {
        type: Array,

        default() {
          return [];
        }

      },
      titles: {
        type: Array,

        default() {
          return [];
        }

      },
      buttonTexts: {
        type: Array,

        default() {
          return [];
        }

      },
      filterPlaceholder: {
        type: String,
        default: ''
      },
      filterMethod: Function,
      leftDefaultChecked: {
        type: Array,

        default() {
          return [];
        }

      },
      rightDefaultChecked: {
        type: Array,

        default() {
          return [];
        }

      },
      renderContent: Function,
      modelValue: {
        type: Array,

        default() {
          return [];
        }

      },
      format: {
        type: Object,

        default() {
          return {};
        }

      },
      filterable: Boolean,
      props: {
        type: Object,

        default() {
          return {
            label: 'label',
            key: 'key',
            disabled: 'disabled'
          };
        }

      },
      targetOrder: {
        type: String,
        default: 'original'
      }
    },

    setup(props, {
      emit,
      slots
    }) {
      const t = useLocale();
      const leftChecked = vue.ref([]);
      const rightChecked = vue.ref([]); // $refs

      const leftPanel = vue.ref(null);
      const rightPanel = vue.ref(null);
      const hasButtonTexts = vue.computed(() => props.buttonTexts.length === 2);

      const clearQuery = which => {
        if (which === 'left') {
          leftPanel.value.query = '';
        } else if (which === 'right') {
          rightPanel.value.query = '';
        }
      };

      vue.watch(props.modelValue, val => emit('update:modelValue', val));
      vue.provide('defaultScopedSlots', vue.computed(() => slots.default));
      const {
        leftTransferPanelTitle,
        rightTransferPanelTitle,
        panelFilterPlaceholder,
        sourceData,
        targetData
      } = useTransferData(props, t);
      const {
        onSourceCheckedChange,
        onTargetCheckedChange,
        addToLeft,
        addToRight
      } = useTransferCheckedChange(props, emit, leftChecked, rightChecked);
      return {
        leftChecked,
        rightChecked,
        hasButtonTexts,
        sourceData,
        targetData,
        leftTransferPanelTitle,
        rightTransferPanelTitle,
        panelFilterPlaceholder,
        onSourceCheckedChange,
        onTargetCheckedChange,
        addToLeft,
        addToRight,
        clearQuery
      };
    }

  };

  const useTransferData = (props, t) => {
    const leftTransferPanelTitle = vue.computed(() => props.titles[0] || t('el.transfer.titles.0'));
    const rightTransferPanelTitle = vue.computed(() => props.titles[1] || t('el.transfer.titles.1'));
    const panelFilterPlaceholder = vue.computed(() => props.filterPlaceholder || t('el.transfer.filterPlaceholder'));
    const dataObj = vue.computed(() => {
      const {
        props: p,
        data
      } = props;
      const key = p.key;
      return data.reduce((o, cur) => (o[cur[key]] = cur) && o, {});
    });
    const sourceData = vue.computed(() => {
      const {
        data,
        modelValue,
        props: p
      } = props;
      return data.filter(item => modelValue.indexOf(item[p.key]) === -1);
    });
    const targetData = vue.computed(() => {
      const {
        data,
        modelValue,
        props: p,
        targetOrder
      } = props;

      if (targetOrder === 'original') {
        return data.filter(item => modelValue.indexOf(item[p.key]) > -1);
      } else {
        return modelValue.reduce((arr, cur) => {
          const val = dataObj.value[cur];

          if (val) {
            arr.push(val);
          }

          return arr;
        }, []);
      }
    });
    return {
      dataObj,
      sourceData,
      targetData,
      leftTransferPanelTitle,
      rightTransferPanelTitle,
      panelFilterPlaceholder
    };
  };

  const useTransferCheckedChange = (props, emit, leftChecked, rightChecked) => {
    const onSourceCheckedChange = (val, movedKeys) => {
      leftChecked.value = val;
      if (movedKeys === undefined) return;
      emit('left-check-change', val, movedKeys);
    };

    const onTargetCheckedChange = (val, movedKeys) => {
      rightChecked.value = val;
      if (movedKeys === undefined) return;
      emit('right-check-change', val, movedKeys);
    };

    const addToLeft = () => {
      const currentValue = props.modelValue.slice();
      rightChecked.value.forEach(item => {
        const index = currentValue.indexOf(item);

        if (index > -1) {
          currentValue.splice(index, 1);
        }
      });
      emit('update:modelValue', currentValue);
      emit('change', currentValue, 'left', rightChecked.value);
    };

    const addToRight = () => {
      const {
        modelValue,
        props: p,
        data,
        targetOrder
      } = props;
      let currentValue = modelValue.slice();
      const itemsToBeMoved = [];
      const key = p.key;
      data.forEach(item => {
        const itemKey = item[key];

        if (leftChecked.value.indexOf(itemKey) > -1 && modelValue.indexOf(itemKey) === -1) {
          itemsToBeMoved.push(itemKey);
        }
      });
      currentValue = targetOrder === 'unshift' ? itemsToBeMoved.concat(currentValue) : currentValue.concat(itemsToBeMoved);
      emit('update:modelValue', currentValue);
      emit('change', currentValue, 'right', leftChecked.value);
    };

    return {
      onSourceCheckedChange,
      onTargetCheckedChange,
      addToLeft,
      addToRight
    };
  };

  const _hoisted_1$A = {
    class: "el-transfer"
  };
  const _hoisted_2$m = {
    class: "el-transfer__buttons"
  };

  const _hoisted_3$i = /*#__PURE__*/vue.createVNode("i", {
    class: "el-icon-arrow-left"
  }, null, -1
  /* HOISTED */
  );

  const _hoisted_4$c = {
    key: 0
  };
  const _hoisted_5$8 = {
    key: 0
  };

  const _hoisted_6$5 = /*#__PURE__*/vue.createVNode("i", {
    class: "el-icon-arrow-right"
  }, null, -1
  /* HOISTED */
  );

  function render$M(_ctx, _cache, $props, $setup, $data, $options) {
    const _component_transfer_panel = vue.resolveComponent("transfer-panel");

    const _component_el_button = vue.resolveComponent("el-button");

    return vue.openBlock(), vue.createBlock("div", _hoisted_1$A, [vue.createVNode(_component_transfer_panel, vue.mergeProps(_ctx.$props, {
      ref: "leftPanel",
      data: $setup.sourceData,
      title: $setup.leftTransferPanelTitle,
      "default-checked": $props.leftDefaultChecked,
      placeholder: $setup.panelFilterPlaceholder,
      onCheckedChange: $setup.onSourceCheckedChange
    }), {
      default: vue.withCtx(() => [vue.renderSlot(_ctx.$slots, "left-footer")]),
      _: 1
      /* STABLE */

    }, 16
    /* FULL_PROPS */
    , ["data", "title", "default-checked", "placeholder", "onCheckedChange"]), vue.createVNode("div", _hoisted_2$m, [vue.createVNode(_component_el_button, {
      type: "primary",
      class: ['el-transfer__button', $setup.hasButtonTexts ? 'is-with-texts' : ''],
      onClick: $setup.addToLeft,
      disabled: $setup.rightChecked.length === 0
    }, {
      default: vue.withCtx(() => [_hoisted_3$i, $props.buttonTexts[0] !== undefined ? (vue.openBlock(), vue.createBlock("span", _hoisted_4$c, vue.toDisplayString($props.buttonTexts[0]), 1
      /* TEXT */
      )) : vue.createCommentVNode("v-if", true)]),
      _: 1
      /* STABLE */

    }, 8
    /* PROPS */
    , ["class", "onClick", "disabled"]), vue.createVNode(_component_el_button, {
      type: "primary",
      class: ['el-transfer__button', $setup.hasButtonTexts ? 'is-with-texts' : ''],
      onClick: $setup.addToRight,
      disabled: $setup.leftChecked.length === 0
    }, {
      default: vue.withCtx(() => [$props.buttonTexts[1] !== undefined ? (vue.openBlock(), vue.createBlock("span", _hoisted_5$8, vue.toDisplayString($props.buttonTexts[1]), 1
      /* TEXT */
      )) : vue.createCommentVNode("v-if", true), _hoisted_6$5]),
      _: 1
      /* STABLE */

    }, 8
    /* PROPS */
    , ["class", "onClick", "disabled"])]), vue.createVNode(_component_transfer_panel, vue.mergeProps(_ctx.$props, {
      ref: "rightPanel",
      data: $setup.targetData,
      title: $setup.rightTransferPanelTitle,
      "default-checked": $props.rightDefaultChecked,
      placeholder: $setup.panelFilterPlaceholder,
      onCheckedChange: $setup.onTargetCheckedChange
    }), {
      default: vue.withCtx(() => [vue.renderSlot(_ctx.$slots, "right-footer")]),
      _: 1
      /* STABLE */

    }, 16
    /* FULL_PROPS */
    , ["data", "title", "default-checked", "placeholder", "onCheckedChange"])]);
  }

  script$U.render = render$M;
  script$U.__file = "packages/transfer/src/Transfer.vue";

  /* istanbul ignore next */

  script$U.install = function (app) {
    app.component(script$U.name, script$U);
  };

  var script$T = {
    name: 'ElForm',
    componentName: 'ElForm',
    props: {
      model: Object,
      rules: Object,
      labelPosition: String,
      labelWidth: String,
      labelSuffix: {
        type: String,
        default: ''
      },
      inline: Boolean,
      inlineMessage: Boolean,
      statusIcon: Boolean,
      showMessage: {
        type: Boolean,
        default: true
      },
      size: String,
      disabled: Boolean,
      validateOnRuleChange: {
        type: Boolean,
        default: true
      },
      hideRequiredAsterisk: {
        type: Boolean,
        default: false
      }
    },
    emits: ['validate'],

    setup(props, {
      emit
    }) {
      const {
        model,
        rules,
        validateOnRuleChange,
        ...rest
      } = vue.toRefs(props);
      const {
        autoLabelWidth,
        registerLabelWidth,
        deregisterLabelWidth
      } = useLabelWidth$1();
      const {
        fields,
        resetFields
      } = useFileds(model);
      const {
        validateField,
        validate,
        clearValidate
      } = useValidate$1(rules, model, fields, validateOnRuleChange);
      vue.provide('elForm', vue.reactive({
        name: 'ElForm',
        ...rest,
        model,
        rules,
        autoLabelWidth,
        registerLabelWidth,
        deregisterLabelWidth,
        resetFields,
        validateField,
        validate,
        clearValidate,
        emit
      }));
      return {
        validate,
        validateField,
        resetFields,
        clearValidate
      };
    }

  };

  const useLabelWidth$1 = () => {
    const potentialLabelWidthArr = vue.reactive([]);
    const autoLabelWidth = vue.computed(() => {
      if (!potentialLabelWidthArr.length) return 0;
      const max = Math.max(...potentialLabelWidthArr);
      return max ? `${max}px` : '';
    });

    const getLabelWidthIndex = width => {
      const index = potentialLabelWidthArr.indexOf(width); // it's impossible

      if (index === -1) {
        throw new Error('[ElementForm]unpected width ', width);
      }

      return index;
    };

    const registerLabelWidth = (val, oldVal) => {
      if (val && oldVal) {
        const index = getLabelWidthIndex(oldVal);
        potentialLabelWidthArr.splice(index, 1, val);
      } else if (val) {
        potentialLabelWidthArr.push(val);
      }
    };

    const deregisterLabelWidth = val => {
      const index = getLabelWidthIndex(val);
      potentialLabelWidthArr.splice(index, 1);
    };

    return {
      autoLabelWidth,
      registerLabelWidth,
      deregisterLabelWidth
    };
  };

  const useFileds = model => {
    const fields = vue.reactive([]);
    const {
      on
    } = useEmitter();
    on('el.form.addField', field => {
      if (field) {
        fields.push(field);
      }
    });
    on('el.form.removeField', field => {
      if (field.prop) {
        fields.splice(fields.indexOf(field), 1);
      }
    });

    const resetFields = () => {
      if (!vue.unref(model)) {
        console.warn('[Element Warn][Form]model is required for resetFields to work.');
        return;
      }

      fields.forEach(field => {
        field.resetField();
      });
    };

    return {
      fields,
      resetFields
    };
  };

  const useValidate$1 = (rules, model, fields, validateOnRuleChange) => {
    const clearValidate = (props = []) => {
      const clearableFiles = props.length ? typeof props === 'string' ? fields.filter(field => props === field.prop) : fields.filter(field => props.includes(field.prop)) : fields;
      clearableFiles.forEach(field => {
        field.clearValidate();
      });
    };

    const validate = callback => {
      if (!model) {
        console.warn('[Element Warn][Form]model is required for validate to work!');
        return;
      }

      let promise; // if no callback, return promise

      if (typeof callback !== 'function') {
        promise = new window.Promise((resolve, reject) => {
          callback = function (valid) {
            valid ? resolve(valid) : reject(valid);
          };
        });
      }

      let valid = true;
      let count = 0; // 如果需要验证的fields为空，调用验证时立刻返回callback

      if (fields.length === 0 && callback) {
        callback(valid);
      }

      let invalidFields = {};
      fields.forEach(field => {
        field.validate('', (message, field) => {
          if (message) {
            valid = false;
          }

          invalidFields = merge({}, invalidFields, field);

          if (typeof callback === 'function' && ++count === fields.length) {
            callback(valid, invalidFields);
          }
        });
      });

      if (promise) {
        return promise;
      }
    };

    const validateField = (props, cb) => {
      props = [].concat(props);
      const validateFields = fields.filter(field => props.includes(field.prop));

      if (!validateFields.length) {
        console.warn('[Element Warn]please pass correct props!');
        return;
      }

      validateFields.forEach(field => {
        field.validate('', cb);
      });
    };

    if (rules) {
      vue.watch(rules, () => {
        // remove then add event listeners on form-item after form rules change
        fields.forEach(field => {
          field.removeValidateEvents();
          field.addValidateEvents();
        });

        if (vue.unref(validateOnRuleChange)) {
          validate(() => {});
        }
      });
    }

    return {
      validateField,
      validate,
      clearValidate
    };
  };

  function render$L(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("form", {
      class: ["el-form", [$props.labelPosition ? 'el-form--label-' + $props.labelPosition : '', {
        'el-form--inline': $props.inline
      }]]
    }, [vue.renderSlot(_ctx.$slots, "default")], 2
    /* CLASS */
    );
  }

  script$T.render = render$L;
  script$T.__file = "packages/form/Form.vue";

  /* istanbul ignore next */

  script$T.install = function (app) {
    app.component(script$T.name, script$T);
  };

  function _extends() {
    _extends = Object.assign || function (target) {
      for (var i = 1; i < arguments.length; i++) {
        var source = arguments[i];

        for (var key in source) {
          if (Object.prototype.hasOwnProperty.call(source, key)) {
            target[key] = source[key];
          }
        }
      }

      return target;
    };

    return _extends.apply(this, arguments);
  }

  function _inheritsLoose(subClass, superClass) {
    subClass.prototype = Object.create(superClass.prototype);
    subClass.prototype.constructor = subClass;
    subClass.__proto__ = superClass;
  }

  function _getPrototypeOf(o) {
    _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
      return o.__proto__ || Object.getPrototypeOf(o);
    };
    return _getPrototypeOf(o);
  }

  function _setPrototypeOf(o, p) {
    _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
      o.__proto__ = p;
      return o;
    };

    return _setPrototypeOf(o, p);
  }

  function _isNativeReflectConstruct() {
    if (typeof Reflect === "undefined" || !Reflect.construct) return false;
    if (Reflect.construct.sham) return false;
    if (typeof Proxy === "function") return true;

    try {
      Date.prototype.toString.call(Reflect.construct(Date, [], function () {}));
      return true;
    } catch (e) {
      return false;
    }
  }

  function _construct(Parent, args, Class) {
    if (_isNativeReflectConstruct()) {
      _construct = Reflect.construct;
    } else {
      _construct = function _construct(Parent, args, Class) {
        var a = [null];
        a.push.apply(a, args);
        var Constructor = Function.bind.apply(Parent, a);
        var instance = new Constructor();
        if (Class) _setPrototypeOf(instance, Class.prototype);
        return instance;
      };
    }

    return _construct.apply(null, arguments);
  }

  function _isNativeFunction(fn) {
    return Function.toString.call(fn).indexOf("[native code]") !== -1;
  }

  function _wrapNativeSuper(Class) {
    var _cache = typeof Map === "function" ? new Map() : undefined;

    _wrapNativeSuper = function _wrapNativeSuper(Class) {
      if (Class === null || !_isNativeFunction(Class)) return Class;

      if (typeof Class !== "function") {
        throw new TypeError("Super expression must either be null or a function");
      }

      if (typeof _cache !== "undefined") {
        if (_cache.has(Class)) return _cache.get(Class);

        _cache.set(Class, Wrapper);
      }

      function Wrapper() {
        return _construct(Class, arguments, _getPrototypeOf(this).constructor);
      }

      Wrapper.prototype = Object.create(Class.prototype, {
        constructor: {
          value: Wrapper,
          enumerable: false,
          writable: true,
          configurable: true
        }
      });
      return _setPrototypeOf(Wrapper, Class);
    };

    return _wrapNativeSuper(Class);
  }
  /* eslint no-console:0 */


  var formatRegExp = /%[sdj%]/g;

  var warning = function warning() {}; // don't print warning message when in production env or node runtime


  if (typeof process !== 'undefined' && process.env && true !== 'production' && typeof window !== 'undefined' && typeof document !== 'undefined') {
    warning = function warning(type, errors) {
      if (typeof console !== 'undefined' && console.warn) {
        if (errors.every(function (e) {
          return typeof e === 'string';
        })) {
          console.warn(type, errors);
        }
      }
    };
  }

  function convertFieldsError(errors) {
    if (!errors || !errors.length) return null;
    var fields = {};
    errors.forEach(function (error) {
      var field = error.field;
      fields[field] = fields[field] || [];
      fields[field].push(error);
    });
    return fields;
  }

  function format() {
    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }

    var i = 1;
    var f = args[0];
    var len = args.length;

    if (typeof f === 'function') {
      return f.apply(null, args.slice(1));
    }

    if (typeof f === 'string') {
      var str = String(f).replace(formatRegExp, function (x) {
        if (x === '%%') {
          return '%';
        }

        if (i >= len) {
          return x;
        }

        switch (x) {
          case '%s':
            return String(args[i++]);

          case '%d':
            return Number(args[i++]);

          case '%j':
            try {
              return JSON.stringify(args[i++]);
            } catch (_) {
              return '[Circular]';
            }

            break;

          default:
            return x;
        }
      });
      return str;
    }

    return f;
  }

  function isNativeStringType(type) {
    return type === 'string' || type === 'url' || type === 'hex' || type === 'email' || type === 'date' || type === 'pattern';
  }

  function isEmptyValue(value, type) {
    if (value === undefined || value === null) {
      return true;
    }

    if (type === 'array' && Array.isArray(value) && !value.length) {
      return true;
    }

    if (isNativeStringType(type) && typeof value === 'string' && !value) {
      return true;
    }

    return false;
  }

  function asyncParallelArray(arr, func, callback) {
    var results = [];
    var total = 0;
    var arrLength = arr.length;

    function count(errors) {
      results.push.apply(results, errors);
      total++;

      if (total === arrLength) {
        callback(results);
      }
    }

    arr.forEach(function (a) {
      func(a, count);
    });
  }

  function asyncSerialArray(arr, func, callback) {
    var index = 0;
    var arrLength = arr.length;

    function next(errors) {
      if (errors && errors.length) {
        callback(errors);
        return;
      }

      var original = index;
      index = index + 1;

      if (original < arrLength) {
        func(arr[original], next);
      } else {
        callback([]);
      }
    }

    next([]);
  }

  function flattenObjArr(objArr) {
    var ret = [];
    Object.keys(objArr).forEach(function (k) {
      ret.push.apply(ret, objArr[k]);
    });
    return ret;
  }

  var AsyncValidationError = /*#__PURE__*/function (_Error) {
    _inheritsLoose(AsyncValidationError, _Error);

    function AsyncValidationError(errors, fields) {
      var _this;

      _this = _Error.call(this, 'Async Validation Error') || this;
      _this.errors = errors;
      _this.fields = fields;
      return _this;
    }

    return AsyncValidationError;
  }( /*#__PURE__*/_wrapNativeSuper(Error));

  function asyncMap(objArr, option, func, callback) {
    if (option.first) {
      var _pending = new Promise(function (resolve, reject) {
        var next = function next(errors) {
          callback(errors);
          return errors.length ? reject(new AsyncValidationError(errors, convertFieldsError(errors))) : resolve();
        };

        var flattenArr = flattenObjArr(objArr);
        asyncSerialArray(flattenArr, func, next);
      });

      _pending["catch"](function (e) {
        return e;
      });

      return _pending;
    }

    var firstFields = option.firstFields || [];

    if (firstFields === true) {
      firstFields = Object.keys(objArr);
    }

    var objArrKeys = Object.keys(objArr);
    var objArrLength = objArrKeys.length;
    var total = 0;
    var results = [];
    var pending = new Promise(function (resolve, reject) {
      var next = function next(errors) {
        results.push.apply(results, errors);
        total++;

        if (total === objArrLength) {
          callback(results);
          return results.length ? reject(new AsyncValidationError(results, convertFieldsError(results))) : resolve();
        }
      };

      if (!objArrKeys.length) {
        callback(results);
        resolve();
      }

      objArrKeys.forEach(function (key) {
        var arr = objArr[key];

        if (firstFields.indexOf(key) !== -1) {
          asyncSerialArray(arr, func, next);
        } else {
          asyncParallelArray(arr, func, next);
        }
      });
    });
    pending["catch"](function (e) {
      return e;
    });
    return pending;
  }

  function complementError(rule) {
    return function (oe) {
      if (oe && oe.message) {
        oe.field = oe.field || rule.fullField;
        return oe;
      }

      return {
        message: typeof oe === 'function' ? oe() : oe,
        field: oe.field || rule.fullField
      };
    };
  }

  function deepMerge(target, source) {
    if (source) {
      for (var s in source) {
        if (source.hasOwnProperty(s)) {
          var value = source[s];

          if (typeof value === 'object' && typeof target[s] === 'object') {
            target[s] = _extends(_extends({}, target[s]), value);
          } else {
            target[s] = value;
          }
        }
      }
    }

    return target;
  }
  /**
   *  Rule for validating required fields.
   *
   *  @param rule The validation rule.
   *  @param value The value of the field on the source object.
   *  @param source The source object being validated.
   *  @param errors An array of errors that this rule may add
   *  validation errors to.
   *  @param options The validation options.
   *  @param options.messages The validation messages.
   */


  function required(rule, value, source, errors, options, type) {
    if (rule.required && (!source.hasOwnProperty(rule.field) || isEmptyValue(value, type || rule.type))) {
      errors.push(format(options.messages.required, rule.fullField));
    }
  }
  /**
   *  Rule for validating whitespace.
   *
   *  @param rule The validation rule.
   *  @param value The value of the field on the source object.
   *  @param source The source object being validated.
   *  @param errors An array of errors that this rule may add
   *  validation errors to.
   *  @param options The validation options.
   *  @param options.messages The validation messages.
   */


  function whitespace(rule, value, source, errors, options) {
    if (/^\s+$/.test(value) || value === '') {
      errors.push(format(options.messages.whitespace, rule.fullField));
    }
  }
  /* eslint max-len:0 */


  var pattern = {
    // http://emailregex.com/
    email: /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/,
    url: new RegExp("^(?!mailto:)(?:(?:http|https|ftp)://|//)(?:\\S+(?::\\S*)?@)?(?:(?:(?:[1-9]\\d?|1\\d\\d|2[01]\\d|22[0-3])(?:\\.(?:1?\\d{1,2}|2[0-4]\\d|25[0-5])){2}(?:\\.(?:[0-9]\\d?|1\\d\\d|2[0-4]\\d|25[0-4]))|(?:(?:[a-z\\u00a1-\\uffff0-9]+-*)*[a-z\\u00a1-\\uffff0-9]+)(?:\\.(?:[a-z\\u00a1-\\uffff0-9]+-*)*[a-z\\u00a1-\\uffff0-9]+)*(?:\\.(?:[a-z\\u00a1-\\uffff]{2,})))|localhost)(?::\\d{2,5})?(?:(/|\\?|#)[^\\s]*)?$", 'i'),
    hex: /^#?([a-f0-9]{6}|[a-f0-9]{3})$/i
  };
  var types = {
    integer: function integer(value) {
      return types.number(value) && parseInt(value, 10) === value;
    },
    "float": function float(value) {
      return types.number(value) && !types.integer(value);
    },
    array: function array(value) {
      return Array.isArray(value);
    },
    regexp: function regexp(value) {
      if (value instanceof RegExp) {
        return true;
      }

      try {
        return !!new RegExp(value);
      } catch (e) {
        return false;
      }
    },
    date: function date(value) {
      return typeof value.getTime === 'function' && typeof value.getMonth === 'function' && typeof value.getYear === 'function' && !isNaN(value.getTime());
    },
    number: function number(value) {
      if (isNaN(value)) {
        return false;
      }

      return typeof value === 'number';
    },
    object: function object(value) {
      return typeof value === 'object' && !types.array(value);
    },
    method: function method(value) {
      return typeof value === 'function';
    },
    email: function email(value) {
      return typeof value === 'string' && !!value.match(pattern.email) && value.length < 255;
    },
    url: function url(value) {
      return typeof value === 'string' && !!value.match(pattern.url);
    },
    hex: function hex(value) {
      return typeof value === 'string' && !!value.match(pattern.hex);
    }
  };
  /**
   *  Rule for validating the type of a value.
   *
   *  @param rule The validation rule.
   *  @param value The value of the field on the source object.
   *  @param source The source object being validated.
   *  @param errors An array of errors that this rule may add
   *  validation errors to.
   *  @param options The validation options.
   *  @param options.messages The validation messages.
   */

  function type(rule, value, source, errors, options) {
    if (rule.required && value === undefined) {
      required(rule, value, source, errors, options);
      return;
    }

    var custom = ['integer', 'float', 'array', 'regexp', 'object', 'method', 'email', 'number', 'date', 'url', 'hex'];
    var ruleType = rule.type;

    if (custom.indexOf(ruleType) > -1) {
      if (!types[ruleType](value)) {
        errors.push(format(options.messages.types[ruleType], rule.fullField, rule.type));
      } // straight typeof check

    } else if (ruleType && typeof value !== rule.type) {
      errors.push(format(options.messages.types[ruleType], rule.fullField, rule.type));
    }
  }
  /**
   *  Rule for validating minimum and maximum allowed values.
   *
   *  @param rule The validation rule.
   *  @param value The value of the field on the source object.
   *  @param source The source object being validated.
   *  @param errors An array of errors that this rule may add
   *  validation errors to.
   *  @param options The validation options.
   *  @param options.messages The validation messages.
   */


  function range$1(rule, value, source, errors, options) {
    var len = typeof rule.len === 'number';
    var min = typeof rule.min === 'number';
    var max = typeof rule.max === 'number'; // 正则匹配码点范围从U+010000一直到U+10FFFF的文字（补充平面Supplementary Plane）

    var spRegexp = /[\uD800-\uDBFF][\uDC00-\uDFFF]/g;
    var val = value;
    var key = null;
    var num = typeof value === 'number';
    var str = typeof value === 'string';
    var arr = Array.isArray(value);

    if (num) {
      key = 'number';
    } else if (str) {
      key = 'string';
    } else if (arr) {
      key = 'array';
    } // if the value is not of a supported type for range validation
    // the validation rule rule should use the
    // type property to also test for a particular type


    if (!key) {
      return false;
    }

    if (arr) {
      val = value.length;
    }

    if (str) {
      // 处理码点大于U+010000的文字length属性不准确的bug，如"𠮷𠮷𠮷".lenght !== 3
      val = value.replace(spRegexp, '_').length;
    }

    if (len) {
      if (val !== rule.len) {
        errors.push(format(options.messages[key].len, rule.fullField, rule.len));
      }
    } else if (min && !max && val < rule.min) {
      errors.push(format(options.messages[key].min, rule.fullField, rule.min));
    } else if (max && !min && val > rule.max) {
      errors.push(format(options.messages[key].max, rule.fullField, rule.max));
    } else if (min && max && (val < rule.min || val > rule.max)) {
      errors.push(format(options.messages[key].range, rule.fullField, rule.min, rule.max));
    }
  }

  var ENUM = 'enum';
  /**
   *  Rule for validating a value exists in an enumerable list.
   *
   *  @param rule The validation rule.
   *  @param value The value of the field on the source object.
   *  @param source The source object being validated.
   *  @param errors An array of errors that this rule may add
   *  validation errors to.
   *  @param options The validation options.
   *  @param options.messages The validation messages.
   */

  function enumerable(rule, value, source, errors, options) {
    rule[ENUM] = Array.isArray(rule[ENUM]) ? rule[ENUM] : [];

    if (rule[ENUM].indexOf(value) === -1) {
      errors.push(format(options.messages[ENUM], rule.fullField, rule[ENUM].join(', ')));
    }
  }
  /**
   *  Rule for validating a regular expression pattern.
   *
   *  @param rule The validation rule.
   *  @param value The value of the field on the source object.
   *  @param source The source object being validated.
   *  @param errors An array of errors that this rule may add
   *  validation errors to.
   *  @param options The validation options.
   *  @param options.messages The validation messages.
   */


  function pattern$1(rule, value, source, errors, options) {
    if (rule.pattern) {
      if (rule.pattern instanceof RegExp) {
        // if a RegExp instance is passed, reset `lastIndex` in case its `global`
        // flag is accidentally set to `true`, which in a validation scenario
        // is not necessary and the result might be misleading
        rule.pattern.lastIndex = 0;

        if (!rule.pattern.test(value)) {
          errors.push(format(options.messages.pattern.mismatch, rule.fullField, value, rule.pattern));
        }
      } else if (typeof rule.pattern === 'string') {
        var _pattern = new RegExp(rule.pattern);

        if (!_pattern.test(value)) {
          errors.push(format(options.messages.pattern.mismatch, rule.fullField, value, rule.pattern));
        }
      }
    }
  }

  var rules = {
    required: required,
    whitespace: whitespace,
    type: type,
    range: range$1,
    "enum": enumerable,
    pattern: pattern$1
  };
  /**
   *  Performs validation for string types.
   *
   *  @param rule The validation rule.
   *  @param value The value of the field on the source object.
   *  @param callback The callback function.
   *  @param source The source object being validated.
   *  @param options The validation options.
   *  @param options.messages The validation messages.
   */

  function string(rule, value, callback, source, options) {
    var errors = [];
    var validate = rule.required || !rule.required && source.hasOwnProperty(rule.field);

    if (validate) {
      if (isEmptyValue(value, 'string') && !rule.required) {
        return callback();
      }

      rules.required(rule, value, source, errors, options, 'string');

      if (!isEmptyValue(value, 'string')) {
        rules.type(rule, value, source, errors, options);
        rules.range(rule, value, source, errors, options);
        rules.pattern(rule, value, source, errors, options);

        if (rule.whitespace === true) {
          rules.whitespace(rule, value, source, errors, options);
        }
      }
    }

    callback(errors);
  }
  /**
   *  Validates a function.
   *
   *  @param rule The validation rule.
   *  @param value The value of the field on the source object.
   *  @param callback The callback function.
   *  @param source The source object being validated.
   *  @param options The validation options.
   *  @param options.messages The validation messages.
   */


  function method(rule, value, callback, source, options) {
    var errors = [];
    var validate = rule.required || !rule.required && source.hasOwnProperty(rule.field);

    if (validate) {
      if (isEmptyValue(value) && !rule.required) {
        return callback();
      }

      rules.required(rule, value, source, errors, options);

      if (value !== undefined) {
        rules.type(rule, value, source, errors, options);
      }
    }

    callback(errors);
  }
  /**
   *  Validates a number.
   *
   *  @param rule The validation rule.
   *  @param value The value of the field on the source object.
   *  @param callback The callback function.
   *  @param source The source object being validated.
   *  @param options The validation options.
   *  @param options.messages The validation messages.
   */


  function number(rule, value, callback, source, options) {
    var errors = [];
    var validate = rule.required || !rule.required && source.hasOwnProperty(rule.field);

    if (validate) {
      if (value === '') {
        value = undefined;
      }

      if (isEmptyValue(value) && !rule.required) {
        return callback();
      }

      rules.required(rule, value, source, errors, options);

      if (value !== undefined) {
        rules.type(rule, value, source, errors, options);
        rules.range(rule, value, source, errors, options);
      }
    }

    callback(errors);
  }
  /**
   *  Validates a boolean.
   *
   *  @param rule The validation rule.
   *  @param value The value of the field on the source object.
   *  @param callback The callback function.
   *  @param source The source object being validated.
   *  @param options The validation options.
   *  @param options.messages The validation messages.
   */


  function _boolean(rule, value, callback, source, options) {
    var errors = [];
    var validate = rule.required || !rule.required && source.hasOwnProperty(rule.field);

    if (validate) {
      if (isEmptyValue(value) && !rule.required) {
        return callback();
      }

      rules.required(rule, value, source, errors, options);

      if (value !== undefined) {
        rules.type(rule, value, source, errors, options);
      }
    }

    callback(errors);
  }
  /**
   *  Validates the regular expression type.
   *
   *  @param rule The validation rule.
   *  @param value The value of the field on the source object.
   *  @param callback The callback function.
   *  @param source The source object being validated.
   *  @param options The validation options.
   *  @param options.messages The validation messages.
   */


  function regexp(rule, value, callback, source, options) {
    var errors = [];
    var validate = rule.required || !rule.required && source.hasOwnProperty(rule.field);

    if (validate) {
      if (isEmptyValue(value) && !rule.required) {
        return callback();
      }

      rules.required(rule, value, source, errors, options);

      if (!isEmptyValue(value)) {
        rules.type(rule, value, source, errors, options);
      }
    }

    callback(errors);
  }
  /**
   *  Validates a number is an integer.
   *
   *  @param rule The validation rule.
   *  @param value The value of the field on the source object.
   *  @param callback The callback function.
   *  @param source The source object being validated.
   *  @param options The validation options.
   *  @param options.messages The validation messages.
   */


  function integer(rule, value, callback, source, options) {
    var errors = [];
    var validate = rule.required || !rule.required && source.hasOwnProperty(rule.field);

    if (validate) {
      if (isEmptyValue(value) && !rule.required) {
        return callback();
      }

      rules.required(rule, value, source, errors, options);

      if (value !== undefined) {
        rules.type(rule, value, source, errors, options);
        rules.range(rule, value, source, errors, options);
      }
    }

    callback(errors);
  }
  /**
   *  Validates a number is a floating point number.
   *
   *  @param rule The validation rule.
   *  @param value The value of the field on the source object.
   *  @param callback The callback function.
   *  @param source The source object being validated.
   *  @param options The validation options.
   *  @param options.messages The validation messages.
   */


  function floatFn(rule, value, callback, source, options) {
    var errors = [];
    var validate = rule.required || !rule.required && source.hasOwnProperty(rule.field);

    if (validate) {
      if (isEmptyValue(value) && !rule.required) {
        return callback();
      }

      rules.required(rule, value, source, errors, options);

      if (value !== undefined) {
        rules.type(rule, value, source, errors, options);
        rules.range(rule, value, source, errors, options);
      }
    }

    callback(errors);
  }
  /**
   *  Validates an array.
   *
   *  @param rule The validation rule.
   *  @param value The value of the field on the source object.
   *  @param callback The callback function.
   *  @param source The source object being validated.
   *  @param options The validation options.
   *  @param options.messages The validation messages.
   */


  function array(rule, value, callback, source, options) {
    var errors = [];
    var validate = rule.required || !rule.required && source.hasOwnProperty(rule.field);

    if (validate) {
      if ((value === undefined || value === null) && !rule.required) {
        return callback();
      }

      rules.required(rule, value, source, errors, options, 'array');

      if (value !== undefined && value !== null) {
        rules.type(rule, value, source, errors, options);
        rules.range(rule, value, source, errors, options);
      }
    }

    callback(errors);
  }
  /**
   *  Validates an object.
   *
   *  @param rule The validation rule.
   *  @param value The value of the field on the source object.
   *  @param callback The callback function.
   *  @param source The source object being validated.
   *  @param options The validation options.
   *  @param options.messages The validation messages.
   */


  function object(rule, value, callback, source, options) {
    var errors = [];
    var validate = rule.required || !rule.required && source.hasOwnProperty(rule.field);

    if (validate) {
      if (isEmptyValue(value) && !rule.required) {
        return callback();
      }

      rules.required(rule, value, source, errors, options);

      if (value !== undefined) {
        rules.type(rule, value, source, errors, options);
      }
    }

    callback(errors);
  }

  var ENUM$1 = 'enum';
  /**
   *  Validates an enumerable list.
   *
   *  @param rule The validation rule.
   *  @param value The value of the field on the source object.
   *  @param callback The callback function.
   *  @param source The source object being validated.
   *  @param options The validation options.
   *  @param options.messages The validation messages.
   */

  function enumerable$1(rule, value, callback, source, options) {
    var errors = [];
    var validate = rule.required || !rule.required && source.hasOwnProperty(rule.field);

    if (validate) {
      if (isEmptyValue(value) && !rule.required) {
        return callback();
      }

      rules.required(rule, value, source, errors, options);

      if (value !== undefined) {
        rules[ENUM$1](rule, value, source, errors, options);
      }
    }

    callback(errors);
  }
  /**
   *  Validates a regular expression pattern.
   *
   *  Performs validation when a rule only contains
   *  a pattern property but is not declared as a string type.
   *
   *  @param rule The validation rule.
   *  @param value The value of the field on the source object.
   *  @param callback The callback function.
   *  @param source The source object being validated.
   *  @param options The validation options.
   *  @param options.messages The validation messages.
   */


  function pattern$2(rule, value, callback, source, options) {
    var errors = [];
    var validate = rule.required || !rule.required && source.hasOwnProperty(rule.field);

    if (validate) {
      if (isEmptyValue(value, 'string') && !rule.required) {
        return callback();
      }

      rules.required(rule, value, source, errors, options);

      if (!isEmptyValue(value, 'string')) {
        rules.pattern(rule, value, source, errors, options);
      }
    }

    callback(errors);
  }

  function date$1(rule, value, callback, source, options) {
    // console.log('integer rule called %j', rule);
    var errors = [];
    var validate = rule.required || !rule.required && source.hasOwnProperty(rule.field); // console.log('validate on %s value', value);

    if (validate) {
      if (isEmptyValue(value, 'date') && !rule.required) {
        return callback();
      }

      rules.required(rule, value, source, errors, options);

      if (!isEmptyValue(value, 'date')) {
        var dateObject;

        if (value instanceof Date) {
          dateObject = value;
        } else {
          dateObject = new Date(value);
        }

        rules.type(rule, dateObject, source, errors, options);

        if (dateObject) {
          rules.range(rule, dateObject.getTime(), source, errors, options);
        }
      }
    }

    callback(errors);
  }

  function required$1(rule, value, callback, source, options) {
    var errors = [];
    var type = Array.isArray(value) ? 'array' : typeof value;
    rules.required(rule, value, source, errors, options, type);
    callback(errors);
  }

  function type$1(rule, value, callback, source, options) {
    var ruleType = rule.type;
    var errors = [];
    var validate = rule.required || !rule.required && source.hasOwnProperty(rule.field);

    if (validate) {
      if (isEmptyValue(value, ruleType) && !rule.required) {
        return callback();
      }

      rules.required(rule, value, source, errors, options, ruleType);

      if (!isEmptyValue(value, ruleType)) {
        rules.type(rule, value, source, errors, options);
      }
    }

    callback(errors);
  }
  /**
   *  Performs validation for any type.
   *
   *  @param rule The validation rule.
   *  @param value The value of the field on the source object.
   *  @param callback The callback function.
   *  @param source The source object being validated.
   *  @param options The validation options.
   *  @param options.messages The validation messages.
   */


  function any(rule, value, callback, source, options) {
    var errors = [];
    var validate = rule.required || !rule.required && source.hasOwnProperty(rule.field);

    if (validate) {
      if (isEmptyValue(value) && !rule.required) {
        return callback();
      }

      rules.required(rule, value, source, errors, options);
    }

    callback(errors);
  }

  var validators = {
    string: string,
    method: method,
    number: number,
    "boolean": _boolean,
    regexp: regexp,
    integer: integer,
    "float": floatFn,
    array: array,
    object: object,
    "enum": enumerable$1,
    pattern: pattern$2,
    date: date$1,
    url: type$1,
    hex: type$1,
    email: type$1,
    required: required$1,
    any: any
  };

  function newMessages() {
    return {
      "default": 'Validation error on field %s',
      required: '%s is required',
      "enum": '%s must be one of %s',
      whitespace: '%s cannot be empty',
      date: {
        format: '%s date %s is invalid for format %s',
        parse: '%s date could not be parsed, %s is invalid ',
        invalid: '%s date %s is invalid'
      },
      types: {
        string: '%s is not a %s',
        method: '%s is not a %s (function)',
        array: '%s is not an %s',
        object: '%s is not an %s',
        number: '%s is not a %s',
        date: '%s is not a %s',
        "boolean": '%s is not a %s',
        integer: '%s is not an %s',
        "float": '%s is not a %s',
        regexp: '%s is not a valid %s',
        email: '%s is not a valid %s',
        url: '%s is not a valid %s',
        hex: '%s is not a valid %s'
      },
      string: {
        len: '%s must be exactly %s characters',
        min: '%s must be at least %s characters',
        max: '%s cannot be longer than %s characters',
        range: '%s must be between %s and %s characters'
      },
      number: {
        len: '%s must equal %s',
        min: '%s cannot be less than %s',
        max: '%s cannot be greater than %s',
        range: '%s must be between %s and %s'
      },
      array: {
        len: '%s must be exactly %s in length',
        min: '%s cannot be less than %s in length',
        max: '%s cannot be greater than %s in length',
        range: '%s must be between %s and %s in length'
      },
      pattern: {
        mismatch: '%s value %s does not match pattern %s'
      },
      clone: function clone() {
        var cloned = JSON.parse(JSON.stringify(this));
        cloned.clone = this.clone;
        return cloned;
      }
    };
  }

  var messages = newMessages();
  /**
   *  Encapsulates a validation schema.
   *
   *  @param descriptor An object declaring validation rules
   *  for this schema.
   */

  function Schema(descriptor) {
    this.rules = null;
    this._messages = messages;
    this.define(descriptor);
  }

  Schema.prototype = {
    messages: function messages(_messages) {
      if (_messages) {
        this._messages = deepMerge(newMessages(), _messages);
      }

      return this._messages;
    },
    define: function define(rules) {
      if (!rules) {
        throw new Error('Cannot configure a schema with no rules');
      }

      if (typeof rules !== 'object' || Array.isArray(rules)) {
        throw new Error('Rules must be an object');
      }

      this.rules = {};
      var z;
      var item;

      for (z in rules) {
        if (rules.hasOwnProperty(z)) {
          item = rules[z];
          this.rules[z] = Array.isArray(item) ? item : [item];
        }
      }
    },
    validate: function validate(source_, o, oc) {
      var _this = this;

      if (o === void 0) {
        o = {};
      }

      if (oc === void 0) {
        oc = function oc() {};
      }

      var source = source_;
      var options = o;
      var callback = oc;

      if (typeof options === 'function') {
        callback = options;
        options = {};
      }

      if (!this.rules || Object.keys(this.rules).length === 0) {
        if (callback) {
          callback();
        }

        return Promise.resolve();
      }

      function complete(results) {
        var i;
        var errors = [];
        var fields = {};

        function add(e) {
          if (Array.isArray(e)) {
            var _errors;

            errors = (_errors = errors).concat.apply(_errors, e);
          } else {
            errors.push(e);
          }
        }

        for (i = 0; i < results.length; i++) {
          add(results[i]);
        }

        if (!errors.length) {
          errors = null;
          fields = null;
        } else {
          fields = convertFieldsError(errors);
        }

        callback(errors, fields);
      }

      if (options.messages) {
        var messages$1 = this.messages();

        if (messages$1 === messages) {
          messages$1 = newMessages();
        }

        deepMerge(messages$1, options.messages);
        options.messages = messages$1;
      } else {
        options.messages = this.messages();
      }

      var arr;
      var value;
      var series = {};
      var keys = options.keys || Object.keys(this.rules);
      keys.forEach(function (z) {
        arr = _this.rules[z];
        value = source[z];
        arr.forEach(function (r) {
          var rule = r;

          if (typeof rule.transform === 'function') {
            if (source === source_) {
              source = _extends({}, source);
            }

            value = source[z] = rule.transform(value);
          }

          if (typeof rule === 'function') {
            rule = {
              validator: rule
            };
          } else {
            rule = _extends({}, rule);
          }

          rule.validator = _this.getValidationMethod(rule);
          rule.field = z;
          rule.fullField = rule.fullField || z;
          rule.type = _this.getType(rule);

          if (!rule.validator) {
            return;
          }

          series[z] = series[z] || [];
          series[z].push({
            rule: rule,
            value: value,
            source: source,
            field: z
          });
        });
      });
      var errorFields = {};
      return asyncMap(series, options, function (data, doIt) {
        var rule = data.rule;
        var deep = (rule.type === 'object' || rule.type === 'array') && (typeof rule.fields === 'object' || typeof rule.defaultField === 'object');
        deep = deep && (rule.required || !rule.required && data.value);
        rule.field = data.field;

        function addFullfield(key, schema) {
          return _extends(_extends({}, schema), {}, {
            fullField: rule.fullField + "." + key
          });
        }

        function cb(e) {
          if (e === void 0) {
            e = [];
          }

          var errors = e;

          if (!Array.isArray(errors)) {
            errors = [errors];
          }

          if (!options.suppressWarning && errors.length) {
            Schema.warning('async-validator:', errors);
          }

          if (errors.length && rule.message !== undefined) {
            errors = [].concat(rule.message);
          }

          errors = errors.map(complementError(rule));

          if (options.first && errors.length) {
            errorFields[rule.field] = 1;
            return doIt(errors);
          }

          if (!deep) {
            doIt(errors);
          } else {
            // if rule is required but the target object
            // does not exist fail at the rule level and don't
            // go deeper
            if (rule.required && !data.value) {
              if (rule.message !== undefined) {
                errors = [].concat(rule.message).map(complementError(rule));
              } else if (options.error) {
                errors = [options.error(rule, format(options.messages.required, rule.field))];
              }

              return doIt(errors);
            }

            var fieldsSchema = {};

            if (rule.defaultField) {
              for (var k in data.value) {
                if (data.value.hasOwnProperty(k)) {
                  fieldsSchema[k] = rule.defaultField;
                }
              }
            }

            fieldsSchema = _extends(_extends({}, fieldsSchema), data.rule.fields);

            for (var f in fieldsSchema) {
              if (fieldsSchema.hasOwnProperty(f)) {
                var fieldSchema = Array.isArray(fieldsSchema[f]) ? fieldsSchema[f] : [fieldsSchema[f]];
                fieldsSchema[f] = fieldSchema.map(addFullfield.bind(null, f));
              }
            }

            var schema = new Schema(fieldsSchema);
            schema.messages(options.messages);

            if (data.rule.options) {
              data.rule.options.messages = options.messages;
              data.rule.options.error = options.error;
            }

            schema.validate(data.value, data.rule.options || options, function (errs) {
              var finalErrors = [];

              if (errors && errors.length) {
                finalErrors.push.apply(finalErrors, errors);
              }

              if (errs && errs.length) {
                finalErrors.push.apply(finalErrors, errs);
              }

              doIt(finalErrors.length ? finalErrors : null);
            });
          }
        }

        var res;

        if (rule.asyncValidator) {
          res = rule.asyncValidator(rule, data.value, cb, data.source, options);
        } else if (rule.validator) {
          res = rule.validator(rule, data.value, cb, data.source, options);

          if (res === true) {
            cb();
          } else if (res === false) {
            cb(rule.message || rule.field + " fails");
          } else if (res instanceof Array) {
            cb(res);
          } else if (res instanceof Error) {
            cb(res.message);
          }
        }

        if (res && res.then) {
          res.then(function () {
            return cb();
          }, function (e) {
            return cb(e);
          });
        }
      }, function (results) {
        complete(results);
      });
    },
    getType: function getType(rule) {
      if (rule.type === undefined && rule.pattern instanceof RegExp) {
        rule.type = 'pattern';
      }

      if (typeof rule.validator !== 'function' && rule.type && !validators.hasOwnProperty(rule.type)) {
        throw new Error(format('Unknown rule type %s', rule.type));
      }

      return rule.type || 'string';
    },
    getValidationMethod: function getValidationMethod(rule) {
      if (typeof rule.validator === 'function') {
        return rule.validator;
      }

      var keys = Object.keys(rule);
      var messageIndex = keys.indexOf('message');

      if (messageIndex !== -1) {
        keys.splice(messageIndex, 1);
      }

      if (keys.length === 1 && keys[0] === 'required') {
        return validators.required;
      }

      return validators[this.getType(rule)] || false;
    }
  };

  Schema.register = function register(type, validator) {
    if (typeof validator !== 'function') {
      throw new Error('Cannot register a validator by type, validator is not a function');
    }

    validators[type] = validator;
  };

  Schema.warning = warning;
  Schema.messages = messages;
  Schema.validators = validators;

  var script$S = {
    props: {
      isAutoWidth: Boolean,
      updateAll: Boolean
    },

    setup(props, {
      slots
    }) {
      const {
        labelStyle,
        labelRef
      } = useLabelWidth(props, slots);
      return () => {
        if (!slots.default) return null;

        if (props.isAutoWidth) {
          return vue.createVNode("div", {
            "ref": labelRef,
            "class": "el-form-item__label-wrap",
            "style": labelStyle
          }, [slots.default()]);
        } else {
          return slots.default();
        }
      };
    }

  };

  function useLabelWidth(props, slots) {
    const computedWidth = vue.ref(0);
    const labelRef = vue.ref(null);

    const _elForm = vue.inject('elForm');

    const _elFormItem = vue.inject('elFormItem');

    const getLabelWidth = () => {
      const $el = vue.unref(labelRef);

      if ($el && $el.firstElementChild) {
        const {
          width
        } = window.getComputedStyle($el.firstElementChild);
        return Math.ceil(parseFloat(width));
      } else {
        return 0;
      }
    };

    const updateLabelWidth = (action = 'update') => {
      const $el = vue.unref(labelRef);

      if (slots.default && props.isAutoWidth && $el.firstElementChild) {
        if (action === 'update') {
          computedWidth.value = getLabelWidth();
        } else if (action === 'remove') {
          _elForm.deregisterLabelWidth(vue.unref(computedWidth));
        }
      }
    };

    vue.watch(computedWidth, (val, oldVal) => {
      if (props.updateAll) {
        _elForm.registerLabelWidth(val, oldVal);

        _elFormItem.updateComputedLabelWidth(val);
      }
    });
    const labelStyle = vue.computed(() => {
      const autoLabelWidth = _elForm.autoLabelWidth;
      const style = {};

      if (autoLabelWidth && autoLabelWidth !== 'auto') {
        const marginLeft = parseInt(autoLabelWidth, 10) - vue.unref(computedWidth);

        if (marginLeft) {
          style.marginLeft = marginLeft + 'px';
        }
      }

      return style;
    });
    vue.onMounted(() => {
      updateLabelWidth('update');
    });
    vue.onUpdated(() => {
      updateLabelWidth('update');
    });
    vue.onBeforeUnmount(() => {
      updateLabelWidth('remove');
    });
    return {
      labelStyle,
      labelRef
    };
  }

  script$S.__file = "packages/form-item/LabelWrap.vue";

  var script$R = {
    name: 'ElFormItem',
    componentName: 'ElFormItem',
    props: {
      label: String,
      labelWidth: String,
      prop: String,
      required: {
        type: Boolean,
        default: undefined
      },
      rules: [Object, Array],
      error: String,
      validateStatus: String,
      for: String,
      inlineMessage: {
        type: [String, Boolean],
        default: ''
      },
      showMessage: {
        type: Boolean,
        default: true
      },
      size: String
    },
    components: {
      // use this component to calculate auto width
      LabelWrap: script$S
    },

    setup(props) {
      const isNested = vue.ref(false);
      const elForm = vue.inject('elForm', {});
      const elFormItem = vue.inject('elFormItem', null);
      isNested.value = !!elFormItem;
      useDispatchFiled(props);
      const {
        labelFor,
        labelStyle,
        computedLabelWidth,
        updateComputedLabelWidth
      } = useLabel(props, elForm);
      const {
        elFormItemSize,
        sizeClass
      } = useFontSize(props, elForm);
      const {
        getRules,
        getFilteredRule
      } = useRules(props, elForm);
      const {
        contentStyle
      } = useContentStyle(props, elForm, isNested, computedLabelWidth);
      const isRequired = useIsRequired(getRules);
      const {
        validateState,
        validateMessage,
        validateDisabled,
        validate,
        clearValidate,
        resetField
      } = useValidate(props, elForm, getFilteredRule);
      const {
        removeValidateEvents,
        addValidateEvents
      } = useValidateEvent(props, validate, getRules, validateDisabled);
      vue.provide('elFormItem', vue.reactive({
        name: 'ElFormItem',
        elFormItemSize,
        updateComputedLabelWidth,
        validateState
      }));
      return {
        labelFor,
        labelStyle,
        sizeClass,
        contentStyle,
        isRequired,
        validate,
        validateState,
        validateMessage,
        resetField,
        clearValidate,
        removeValidateEvents,
        addValidateEvents,
        elForm
      };
    }

  };

  function useLabel(props, elForm) {
    const computedLabelWidth = vue.ref('');
    const labelFor = vue.computed(() => props.for || props.prop);
    const labelStyle = vue.computed(() => {
      const ret = {};
      if (elForm.labelPosition === 'top') return ret;
      const labelWidth = props.labelWidth || elForm.labelWidth;

      if (labelWidth) {
        ret.width = labelWidth;
      }

      return ret;
    });

    const updateComputedLabelWidth = width => {
      computedLabelWidth.value = width ? `${width}px` : '';
    };

    return {
      labelFor,
      labelStyle,
      computedLabelWidth,
      updateComputedLabelWidth
    };
  }

  function useFontSize(props, elForm) {
    const _this = vue.getCurrentInstance();

    const elFormItemSize = vue.computed(() => {
      return props.size || vue.unref(elForm.size);
    });
    const sizeClass = vue.computed(() => {
      return vue.unref(elFormItemSize) || (_this.$ELEMENT || {}).size;
    });
    return {
      elFormItemSize,
      sizeClass
    };
  }

  function useContentStyle(props, elForm, isNested, computedLabelWidth) {
    const contentStyle = vue.computed(() => {
      const ret = {};
      const label = props.label;
      if (elForm.labelPosition === 'top' || elForm.inline) return ret;
      if (!label && !props.labelWidth && vue.unref(isNested)) return ret;
      const labelWidth = props.labelWidth || elForm.labelWidth;

      if (labelWidth === 'auto') {
        if (props.labelWidth === 'auto') {
          ret.marginLeft = vue.unref(computedLabelWidth);
        } else if (elForm.labelWidth === 'auto') {
          ret.marginLeft = elForm.autoLabelWidth;
        }
      } else {
        ret.marginLeft = labelWidth;
      }

      return ret;
    });
    return {
      contentStyle
    };
  }

  function useFieldValue(props, elForm) {
    const initialValue = vue.ref();
    const fieldValue = vue.computed(() => {
      const model = elForm.model;

      if (!model || !props.prop) {
        return;
      }

      let path = props.prop;

      if (path.indexOf(':') !== -1) {
        path = path.replace(/:/, '.');
      }

      return getPropByPath(model, path, true).v;
    });
    vue.onMounted(function () {
      if (props.prop) {
        initialValue.value = vue.unref(fieldValue);

        if (Array.isArray(initialValue.value)) {
          initialValue.value = initialValue.value.slice();
        }
      }
    });
    return {
      fieldValue,
      initialValue
    };
  }

  function useDispatchFiled(props) {
    const {
      dispatch
    } = useEmitter();
    const {
      proxy
    } = vue.getCurrentInstance();
    vue.onMounted(() => {
      if (props.prop) {
        dispatch('el.form.addField', proxy);
      }
    });
    vue.onBeforeUnmount(() => {
      dispatch('el.form.removeField', proxy);
    });
  }

  function useValidateEvent(props, validate, getRules, validateDisabled) {
    const {
      on,
      off
    } = useEmitter();

    const onFieldBlur = () => {
      validate('blur');
    };

    const onFieldChange = () => {
      if (vue.unref(validateDisabled)) {
        validateDisabled.value = false;
        return;
      }

      validate('change');
    };

    const addValidateEvents = () => {
      const rules = getRules();

      if (rules.length || props.required !== undefined) {
        on('el.form.blur', onFieldBlur);
        on('el.form.change', onFieldChange);
      }
    };

    vue.onMounted(() => {
      if (props.prop) {
        addValidateEvents();
      }
    });
    return {
      removeValidateEvents: off,
      addValidateEvents
    };
  }

  const useIsRequired = getRules => {
    return vue.computed(() => {
      const rules = getRules();
      let isRequired = false;

      if (rules && rules.length) {
        rules.every(rule => {
          if (rule.required) {
            isRequired = true;
            return false;
          }

          return true;
        });
      }

      return isRequired;
    });
  };

  const useRules = (props, elForm) => {
    const getRules = () => {
      let formRules = elForm.rules;
      const selfRules = props.rules;
      const requiredRule = props.required !== undefined ? {
        required: !!props.required
      } : [];
      const prop = getPropByPath(formRules, props.prop || '');
      formRules = formRules ? prop.o[props.prop || ''] || prop.v : [];
      return [].concat(selfRules || formRules || []).concat(requiredRule);
    };

    const getFilteredRule = trigger => {
      const rules = getRules();
      return rules.filter(rule => {
        if (!rule.trigger || trigger === '') return true;

        if (Array.isArray(rule.trigger)) {
          return rule.trigger.indexOf(trigger) > -1;
        } else {
          return rule.trigger === trigger;
        }
      }).map(rule => merge({}, rule));
    };

    return {
      getRules,
      getFilteredRule
    };
  };

  function useValidate(props, elForm, getFilteredRule) {
    const {
      fieldValue,
      initialValue
    } = useFieldValue(props, elForm);
    const {
      broadcast
    } = useEmitter();
    const validateState = vue.ref('');
    const validateMessage = vue.ref('');
    const validateDisabled = vue.ref(false);
    vue.watch(() => props.error, value => {
      validateMessage.value = value;
      validateState.value = value ? 'error' : '';
    }, {
      immediate: true
    });
    vue.watch(() => props.validateStatus, value => validateState.value = value);

    const validate = (trigger, callback = noop$1) => {
      validateDisabled.value = false;
      const rules = getFilteredRule(trigger);
      validateState.value = 'validating';

      if ((!rules || rules.length === 0) && props.required === undefined) {
        callback();
        return true;
      }

      const descriptor = {};

      if (rules && rules.length > 0) {
        rules.forEach(rule => {
          delete rule.trigger;
        });
      }

      descriptor[props.prop] = rules;
      const validator = new Schema(descriptor);
      const model = {};
      model[props.prop] = vue.unref(fieldValue);
      validator.validate(model, {
        firstFields: true
      }, (errors, invalidFields) => {
        validateState.value = !errors ? 'success' : 'error';
        validateMessage.value = errors ? errors[0].message : '';
        callback(validateMessage.value, invalidFields);
        elForm && elForm.emit('validate', props.prop, !errors, validateMessage.value || null);
      });
    };

    const clearValidate = () => {
      validateState.value = '';
      validateMessage.value = '';
      validateDisabled.value = false;
    };

    const resetField = () => {
      validateState.value = '';
      validateMessage.value = '';
      const model = elForm.model;
      const value = vue.unref(fieldValue);
      let path = props.prop;

      if (path.indexOf(':') !== -1) {
        path = path.replace(/:/, '.');
      }

      const prop = getPropByPath(model, path, true);
      validateDisabled.value = true;

      if (Array.isArray(value)) {
        prop.o[prop.k] = [].concat(initialValue.value);
      } else {
        prop.o[prop.k] = initialValue.value;
      } // reset validateDisabled after onFieldChange triggered


      vue.nextTick(() => {
        validateDisabled.value = false;
      });
      broadcast('fieldReset', initialValue.value);
    };

    return {
      validateState,
      validateMessage,
      validateDisabled,
      validate,
      clearValidate,
      resetField
    };
  }

  function render$K(_ctx, _cache, $props, $setup, $data, $options) {
    const _component_label_wrap = vue.resolveComponent("label-wrap");

    return vue.openBlock(), vue.createBlock("div", {
      class: ["el-form-item", [{
        'el-form-item--feedback': $setup.elForm && $setup.elForm.statusIcon,
        'is-error': $setup.validateState === 'error',
        'is-validating': $setup.validateState === 'validating',
        'is-success': $setup.validateState === 'success',
        'is-required': $setup.isRequired || $props.required,
        'is-no-asterisk': $setup.elForm && $setup.elForm.hideRequiredAsterisk
      }, $setup.sizeClass ? 'el-form-item--' + $setup.sizeClass : '']]
    }, [vue.createVNode(_component_label_wrap, {
      "is-auto-width": $setup.labelStyle && $setup.labelStyle.width === 'auto',
      "update-all": $setup.elForm.labelWidth === 'auto'
    }, {
      default: vue.withCtx(() => [$props.label || _ctx.$slots.label ? (vue.openBlock(), vue.createBlock("label", {
        key: 0,
        for: $setup.labelFor,
        class: "el-form-item__label",
        style: $setup.labelStyle
      }, [vue.renderSlot(_ctx.$slots, "label", {}, () => [vue.createTextVNode(vue.toDisplayString($props.label + $setup.elForm.labelSuffix), 1
      /* TEXT */
      )])], 12
      /* STYLE, PROPS */
      , ["for"])) : vue.createCommentVNode("v-if", true)]),
      _: 1
      /* STABLE */

    }, 8
    /* PROPS */
    , ["is-auto-width", "update-all"]), vue.createVNode("div", {
      class: "el-form-item__content",
      style: $setup.contentStyle
    }, [vue.renderSlot(_ctx.$slots, "default"), vue.createVNode(vue.Transition, {
      name: "el-zoom-in-top"
    }, {
      default: vue.withCtx(() => [$setup.validateState === 'error' && $props.showMessage && $setup.elForm.showMessage ? vue.renderSlot(_ctx.$slots, "error", {
        key: 0,
        error: $setup.validateMessage
      }, () => [vue.createVNode("div", {
        class: ["el-form-item__error", {
          'el-form-item__error--inline': typeof $props.inlineMessage === 'boolean' ? $props.inlineMessage : $setup.elForm && $setup.elForm.inlineMessage || false
        }]
      }, vue.toDisplayString($setup.validateMessage), 3
      /* TEXT, CLASS */
      )]) : vue.createCommentVNode("v-if", true)]),
      _: 1
      /* STABLE */

    })], 4
    /* STYLE */
    )], 2
    /* CLASS */
    );
  }

  script$R.render = render$K;
  script$R.__file = "packages/form-item/FormItem.vue";

  /* istanbul ignore next */

  script$R.install = function (app) {
    app.component(script$R.name, script$R);
  };

  const getCell = function (event) {
    let cell = event.target;

    while (cell && cell.tagName.toUpperCase() !== 'HTML') {
      if (cell.tagName.toUpperCase() === 'TD') {
        return cell;
      }

      cell = cell.parentNode;
    }

    return null;
  };

  const isObject$1 = function (obj) {
    return obj !== null && typeof obj === 'object';
  };

  const orderBy = function (array, sortKey, reverse, sortMethod, sortBy) {
    if (!sortKey && !sortMethod && (!sortBy || Array.isArray(sortBy) && !sortBy.length)) {
      return array;
    }

    if (typeof reverse === 'string') {
      reverse = reverse === 'descending' ? -1 : 1;
    } else {
      reverse = reverse && reverse < 0 ? -1 : 1;
    }

    const getKey = sortMethod ? null : function (value, index) {
      if (sortBy) {
        if (!Array.isArray(sortBy)) {
          sortBy = [sortBy];
        }

        return sortBy.map(function (by) {
          if (typeof by === 'string') {
            return getValueByPath(value, by);
          } else {
            return by(value, index, array);
          }
        });
      }

      if (sortKey !== '$key') {
        if (isObject$1(value) && '$value' in value) value = value.$value;
      }

      return [isObject$1(value) ? getValueByPath(value, sortKey) : value];
    };

    const compare = function (a, b) {
      if (sortMethod) {
        return sortMethod(a.value, b.value);
      }

      for (let i = 0, len = a.key.length; i < len; i++) {
        if (a.key[i] < b.key[i]) {
          return -1;
        }

        if (a.key[i] > b.key[i]) {
          return 1;
        }
      }

      return 0;
    };

    return array.map(function (value, index) {
      return {
        value: value,
        index: index,
        key: getKey ? getKey(value, index) : null
      };
    }).sort(function (a, b) {
      let order = compare(a, b);

      if (!order) {
        // make stable https://en.wikipedia.org/wiki/Sorting_algorithm#Stability
        order = a.index - b.index;
      }

      return order * reverse;
    }).map(item => item.value);
  };
  const getColumnById = function (table, columnId) {
    let column = null;
    table.columns.forEach(function (item) {
      if (item.id === columnId) {
        column = item;
      }
    });
    return column;
  };
  const getColumnByKey = function (table, columnKey) {
    let column = null;

    for (let i = 0; i < table.columns.length; i++) {
      const item = table.columns[i];

      if (item.columnKey === columnKey) {
        column = item;
        break;
      }
    }

    return column;
  };
  const getColumnByCell = function (table, cell) {
    const matches = (cell.className || '').match(/el-table_[^\s]+/gm);

    if (matches) {
      return getColumnById(table, matches[0]);
    }

    return null;
  };
  const getRowIdentity = (row, rowKey) => {
    if (!row) throw new Error('row is required when get row identity');

    if (typeof rowKey === 'string') {
      if (rowKey.indexOf('.') < 0) {
        return row[rowKey];
      }

      const key = rowKey.split('.');
      let current = row;

      for (let i = 0; i < key.length; i++) {
        current = current[key[i]];
      }

      return current;
    } else if (typeof rowKey === 'function') {
      return rowKey.call(null, row);
    }
  };
  const getKeysMap = function (array, rowKey) {
    const arrayMap = {};
    (array || []).forEach((row, index) => {
      arrayMap[getRowIdentity(row, rowKey)] = {
        row,
        index
      };
    });
    return arrayMap;
  };

  function hasOwn(obj, key) {
    return Object.prototype.hasOwnProperty.call(obj, key);
  }

  function mergeOptions$1(defaults, config) {
    const options = {};
    let key;

    for (key in defaults) {
      options[key] = defaults[key];
    }

    for (key in config) {
      if (hasOwn(config, key)) {
        const value = config[key];

        if (typeof value !== 'undefined') {
          options[key] = value;
        }
      }
    }

    return options;
  }
  function parseWidth(width) {
    if (width !== undefined) {
      width = parseInt(width, 10);

      if (isNaN(width)) {
        width = null;
      }
    }

    return width;
  }
  function parseMinWidth(minWidth) {
    if (typeof minWidth !== 'undefined') {
      minWidth = parseWidth(minWidth);

      if (isNaN(minWidth)) {
        minWidth = 80;
      }
    }

    return minWidth;
  }
  function parseHeight(height) {
    if (typeof height === 'number') {
      return height;
    }

    if (typeof height === 'string') {
      if (/^\d+(?:px)?$/.test(height)) {
        return parseInt(height, 10);
      } else {
        return height;
      }
    }

    return null;
  } // https://github.com/reduxjs/redux/blob/master/src/compose.js

  function compose(...funcs) {
    if (funcs.length === 0) {
      return arg => arg;
    }

    if (funcs.length === 1) {
      return funcs[0];
    }

    return funcs.reduce((a, b) => (...args) => a(b(...args)));
  }
  function toggleRowStatus(statusArr, row, newVal) {
    let changed = false;
    const index = statusArr.indexOf(row);
    const included = index !== -1;

    const addRow = () => {
      statusArr.push(row);
      changed = true;
    };

    const removeRow = () => {
      statusArr.splice(index, 1);
      changed = true;
    };

    if (typeof newVal === 'boolean') {
      if (newVal && !included) {
        addRow();
      } else if (!newVal && included) {
        removeRow();
      }
    } else {
      if (included) {
        removeRow();
      } else {
        addRow();
      }
    }

    return changed;
  }
  function walkTreeNode(root, cb, childrenKey = 'children', lazyKey = 'hasChildren') {
    const isNil = array => !(Array.isArray(array) && array.length);

    function _walker(parent, children, level) {
      cb(parent, children, level);
      children.forEach(item => {
        if (item[lazyKey]) {
          cb(item, null, level + 1);
          return;
        }

        const children = item[childrenKey];

        if (!isNil(children)) {
          _walker(item, children, level + 1);
        }
      });
    }

    root.forEach(item => {
      if (item[lazyKey]) {
        cb(item, null, 0);
        return;
      }

      const children = item[childrenKey];

      if (!isNil(children)) {
        _walker(item, children, 0);
      }
    });
  }

  function useExpand$1(watcherData) {
    const instance = vue.getCurrentInstance();
    const defaultExpandAll = vue.ref(false);
    const expandRows = vue.ref([]);

    const updateExpandRows = () => {
      const data = watcherData.data.value || [];
      const rowKey = watcherData.rowKey.value;

      if (defaultExpandAll.value) {
        expandRows.value = data.slice();
      } else if (rowKey) {
        // TODO：这里的代码可以优化
        const expandRowsMap = getKeysMap(expandRows.value, rowKey);
        expandRows.value = data.reduce((prev, row) => {
          const rowId = getRowIdentity(row, rowKey);
          const rowInfo = expandRowsMap[rowId];

          if (rowInfo) {
            prev.push(row);
          }

          return prev;
        }, []);
      } else {
        expandRows.value = [];
      }
    };

    const toggleRowExpansion = (row, expanded) => {
      const changed = toggleRowStatus(expandRows.value, row, expanded);

      if (changed) {
        instance.emit('expand-change', row, expandRows.value.slice());
        instance.store.scheduleLayout();
      }
    };

    const setExpandRowKeys = rowKeys => {
      instance.store.assertRowKey(); // TODO：这里的代码可以优化

      const data = watcherData.data.value || [];
      const rowKey = watcherData.rowKey.value;
      const keysMap = getKeysMap(data, rowKey);
      expandRows.value = rowKeys.reduce((prev, cur) => {
        const info = keysMap[cur];

        if (info) {
          prev.push(info.row);
        }

        return prev;
      }, []);
    };

    const isRowExpanded = row => {
      const rowKey = watcherData.rowKey.value;

      if (rowKey) {
        const expandMap = getKeysMap(expandRows.value, rowKey);
        return !!expandMap[getRowIdentity(row, rowKey)];
      }

      return expandRows.value.indexOf(row) !== -1;
    };

    return {
      updateExpandRows,
      toggleRowExpansion,
      setExpandRowKeys,
      isRowExpanded,
      states: {
        expandRows,
        defaultExpandAll
      }
    };
  }

  function useCurrent(watcherData) {
    const instance = vue.getCurrentInstance();

    const _currentRowKey = vue.ref(null);

    const currentRow = vue.ref(null);

    const setCurrentRowKey = key => {
      instance.store.assertRowKey();
      _currentRowKey.value = key;
      setCurrentRowByKey(key);
    };

    const restoreCurrentRowKey = () => {
      _currentRowKey.value = null;
    };

    const setCurrentRowByKey = key => {
      const {
        data = [],
        rowKey
      } = watcherData;
      let _currentRow = null;

      if (rowKey.value) {
        _currentRow = arrayFind(vue.unref(data), item => getRowIdentity(item, rowKey.value) === key);
      }

      currentRow.value = _currentRow;
    };

    const updateCurrentRow = _currentRow => {
      const oldCurrentRow = currentRow.value;

      if (_currentRow && _currentRow !== oldCurrentRow) {
        currentRow.value = _currentRow;
        instance.emit('current-change', currentRow.value, oldCurrentRow);
        return;
      }

      if (!_currentRow && oldCurrentRow) {
        currentRow.value = null;
        instance.emit('current-change', null, oldCurrentRow);
      }
    };

    const updateCurrentRowData = () => {
      const rowKey = watcherData.rowKey.value; // data 为 null 时，解构时的默认值会被忽略

      const data = watcherData.data.value || [];
      const oldCurrentRow = currentRow.value; // 当 currentRow 不在 data 中时尝试更新数据

      if (data.indexOf(oldCurrentRow) === -1 && oldCurrentRow) {
        if (rowKey) {
          const currentRowKey = getRowIdentity(oldCurrentRow, rowKey);
          setCurrentRowByKey(currentRowKey);
        } else {
          currentRow.value = null;
        }

        if (currentRow.value === null) {
          instance.emit('current-change', null, oldCurrentRow);
        }
      } else if (_currentRowKey.value) {
        // 把初始时下设置的 rowKey 转化成 rowData
        setCurrentRowByKey(_currentRowKey.value);
        restoreCurrentRowKey();
      }
    };

    return {
      setCurrentRowKey,
      restoreCurrentRowKey,
      setCurrentRowByKey,
      updateCurrentRow,
      updateCurrentRowData,
      states: {
        _currentRowKey,
        currentRow
      }
    };
  }

  function useTree(watcherData) {
    const expandRowKeys = vue.ref([]);
    const treeData = vue.ref({});
    const indent = vue.ref(16);
    const lazy = vue.ref(false);
    const lazyTreeNodeMap = vue.ref({});
    const lazyColumnIdentifier = vue.ref('hasChildren');
    const childrenColumnName = vue.ref('children');
    const instance = vue.getCurrentInstance();
    const normalizedData = vue.computed(() => {
      if (!watcherData.rowKey.value) return {};
      const data = watcherData.data.value || [];
      return normalize(data);
    });
    const normalizedLazyNode = vue.computed(() => {
      const rowKey = watcherData.rowKey.value;
      const keys = Object.keys(lazyTreeNodeMap.value);
      const res = {};
      if (!keys.length) return res;
      keys.forEach(key => {
        if (lazyTreeNodeMap.value[key].length) {
          const item = {
            children: []
          };
          lazyTreeNodeMap.value[key].forEach(row => {
            const currentRowKey = getRowIdentity(row, rowKey);
            item.children.push(currentRowKey);

            if (row[lazyColumnIdentifier.value] && !res[currentRowKey]) {
              res[currentRowKey] = {
                children: []
              };
            }
          });
          res[key] = item;
        }
      });
      return res;
    });

    const normalize = data => {
      const rowKey = watcherData.rowKey.value;
      const res = {};
      walkTreeNode(data, (parent, children, level) => {
        const parentId = getRowIdentity(parent, rowKey);

        if (Array.isArray(children)) {
          res[parentId] = {
            children: children.map(row => getRowIdentity(row, rowKey)),
            level
          };
        } else if (lazy.value) {
          // 当 children 不存在且 lazy 为 true，该节点即为懒加载的节点
          res[parentId] = {
            children: [],
            lazy: true,
            level
          };
        }
      }, childrenColumnName.value, lazyColumnIdentifier.value);
      return res;
    };

    const updateTreeData = () => {
      var _instance$store2;

      const nested = normalizedData.value;
      const normalizedLazyNode_ = normalizedLazyNode.value;
      const keys = Object.keys(nested);
      const newTreeData = {};

      if (keys.length) {
        var _instance$store;

        const oldTreeData = vue.unref(treeData);
        const defaultExpandAll = (_instance$store = instance.store) === null || _instance$store === void 0 ? void 0 : _instance$store.states.defaultExpandAll.value;
        const rootLazyRowKeys = [];

        const getExpanded = (oldValue, key) => {
          const included = defaultExpandAll || expandRowKeys.value && expandRowKeys.value.indexOf(key) !== -1;
          return !!(oldValue && oldValue.expanded || included);
        }; // 合并 expanded 与 display，确保数据刷新后，状态不变


        keys.forEach(key => {
          const oldValue = oldTreeData[key];
          const newValue = { ...nested[key]
          };
          newValue.expanded = getExpanded(oldValue, key);

          if (newValue.lazy) {
            const {
              loaded = false,
              loading = false
            } = oldValue || {};
            newValue.loaded = !!loaded;
            newValue.loading = !!loading;
            rootLazyRowKeys.push(key);
          }

          newTreeData[key] = newValue;
        }); // 根据懒加载数据更新 treeData

        const lazyKeys = Object.keys(normalizedLazyNode_);

        if (lazy.value && lazyKeys.length && rootLazyRowKeys.length) {
          lazyKeys.forEach(key => {
            const oldValue = oldTreeData[key];
            const lazyNodeChildren = normalizedLazyNode_[key].children;

            if (rootLazyRowKeys.indexOf(key) !== -1) {
              // 懒加载的 root 节点，更新一下原有的数据，原来的 children 一定是空数组
              if (newTreeData[key].children.length !== 0) {
                throw new Error('[ElTable]children must be an empty array.');
              }

              newTreeData[key].children = lazyNodeChildren;
            } else {
              const {
                loaded = false,
                loading = false
              } = oldValue || {};
              newTreeData[key] = {
                lazy: true,
                loaded: !!loaded,
                loading: !!loading,
                expanded: getExpanded(oldValue, key),
                children: lazyNodeChildren,
                level: ''
              };
            }
          });
        }
      }

      treeData.value = newTreeData;
      (_instance$store2 = instance.store) === null || _instance$store2 === void 0 ? void 0 : _instance$store2.updateTableScrollY();
    };

    vue.watch(() => normalizedData.value, updateTreeData);
    vue.watch(() => normalizedLazyNode.value, updateTreeData);

    const updateTreeExpandKeys = value => {
      expandRowKeys.value = value;
      updateTreeData();
    };

    const toggleTreeExpansion = (row, expanded) => {
      instance.store.assertRowKey();
      const rowKey = watcherData.rowKey.value;
      const id = getRowIdentity(row, rowKey);
      const data = id && treeData.value[id];

      if (id && data && 'expanded' in data) {
        const oldExpanded = data.expanded;
        expanded = typeof expanded === 'undefined' ? !data.expanded : expanded;
        treeData.value[id].expanded = expanded;

        if (oldExpanded !== expanded) {
          instance.emit('expand-change', row, expanded);
        }

        instance.store.updateTableScrollY();
      }
    };

    const loadOrToggle = row => {
      instance.store.assertRowKey();
      const rowKey = watcherData.rowKey.value;
      const id = getRowIdentity(row, rowKey);
      const data = treeData.value[id];

      if (lazy.value && data && 'loaded' in data && !data.loaded) {
        loadData(row, id, data);
      } else {
        toggleTreeExpansion(row, undefined);
      }
    };

    const loadData = (row, key, treeNode) => {
      const {
        load
      } = instance.props;

      if (load && !treeData.value[key].loaded) {
        treeData.value[key].loading = true;
        load(row, treeNode, data => {
          if (!Array.isArray(data)) {
            throw new Error('[ElTable] data must be an array');
          }

          treeData.value[key].loading = false;
          treeData.value[key].loaded = true;
          treeData.value[key].expanded = true;

          if (data.length) {
            lazyTreeNodeMap.value[key] = data;
          }

          instance.emit('expand-change', row, true);
        });
      }
    };

    return {
      loadData,
      loadOrToggle,
      toggleTreeExpansion,
      updateTreeExpandKeys,
      updateTreeData,
      normalize,
      states: {
        expandRowKeys,
        treeData,
        indent,
        lazy,
        lazyTreeNodeMap,
        lazyColumnIdentifier,
        childrenColumnName
      }
    };
  }

  const sortData = (data, states) => {
    const sortingColumn = states.sortingColumn;

    if (!sortingColumn || typeof sortingColumn.sortable === 'string') {
      return data;
    }

    return orderBy(data, states.sortProp, states.sortOrder, sortingColumn.sortMethod, sortingColumn.sortBy);
  };

  const doFlattenColumns = columns => {
    const result = [];
    columns.forEach(column => {
      if (column.children) {
        // eslint-disable-next-line prefer-spread
        result.push.apply(result, doFlattenColumns(column.children));
      } else {
        result.push(column);
      }
    });
    return result;
  };

  function useWatcher$1() {
    const instance = vue.getCurrentInstance();
    const rowKey = vue.ref(null);
    const data = vue.ref([]);

    const _data = vue.ref([]);

    const isComplex = vue.ref(false);

    const _columns = vue.ref([]);

    const originColumns = vue.ref([]);
    const columns = vue.ref([]);
    const fixedColumns = vue.ref([]);
    const rightFixedColumns = vue.ref([]);
    const leafColumns = vue.ref([]);
    const fixedLeafColumns = vue.ref([]);
    const rightFixedLeafColumns = vue.ref([]);
    const leafColumnsLength = vue.ref(0);
    const fixedLeafColumnsLength = vue.ref(0);
    const rightFixedLeafColumnsLength = vue.ref(0);
    const isAllSelected = vue.ref(false);
    const selection = vue.ref([]);
    const reserveSelection = vue.ref(false);
    const selectOnIndeterminate = vue.ref(false);
    const selectable = vue.ref(null);
    const filters = vue.ref({});
    const filteredData = vue.ref(null);
    const sortingColumn = vue.ref(null);
    const sortProp = vue.ref(null);
    const sortOrder = vue.ref(null);
    const hoverRow = vue.ref(null); // 检查 rowKey 是否存在

    const assertRowKey = () => {
      if (!rowKey.value) throw new Error('[ElTable] prop row-key is required');
    }; // 更新列


    const updateColumns = () => {
      fixedColumns.value = _columns.value.filter(column => column.fixed === true || column.fixed === 'left');
      rightFixedColumns.value = _columns.value.filter(column => column.fixed === 'right');

      if (fixedColumns.value.length > 0 && _columns.value[0] && _columns.value[0].type === 'selection' && !_columns.value[0].fixed) {
        _columns.value[0].fixed = true;
        fixedColumns.value.unshift(_columns.value[0]);
      }

      const notFixedColumns = _columns.value.filter(column => !column.fixed);

      originColumns.value = [].concat(fixedColumns.value).concat(notFixedColumns).concat(rightFixedColumns.value);
      const leafColumns = doFlattenColumns(notFixedColumns);
      const fixedLeafColumns = doFlattenColumns(fixedColumns.value);
      const rightFixedLeafColumns = doFlattenColumns(rightFixedColumns.value);
      leafColumnsLength.value = leafColumns.length;
      fixedLeafColumnsLength.value = fixedLeafColumns.length;
      rightFixedLeafColumnsLength.value = rightFixedLeafColumns.length;
      columns.value = [].concat(fixedLeafColumns).concat(leafColumns).concat(rightFixedLeafColumns);
      isComplex.value = fixedColumns.value.length > 0 || rightFixedColumns.value.length > 0;
    }; // 更新 DOM


    const scheduleLayout = (needUpdateColumns, immediate = false) => {
      if (needUpdateColumns) {
        updateColumns();
      }

      if (immediate) {
        instance.state.doLayout();
      } else {
        instance.state.debouncedUpdateLayout();
      }
    }; // 选择


    const isSelected = row => {
      return selection.value.indexOf(row) > -1;
    };

    const clearSelection = () => {
      isAllSelected.value = false;
      const oldSelection = selection.value;

      if (oldSelection.length) {
        selection.value = [];
        instance.emit('selection-change', []);
      }
    };

    const cleanSelection = () => {
      let deleted;

      if (rowKey.value) {
        deleted = [];
        const selectedMap = getKeysMap(selection.value, rowKey.value);
        const dataMap = getKeysMap(data.value, rowKey.value);

        for (const key in selectedMap) {
          // eslint-disable-next-line no-prototype-builtins
          if (selectedMap.hasOwnProperty(key) && !dataMap[key]) {
            deleted.push(selectedMap[key].row);
          }
        }
      } else {
        deleted = selection.value.filter(item => data.value.indexOf(item) === -1);
      }

      if (deleted.length) {
        const newSelection = selection.value.filter(item => deleted.indexOf(item) === -1);
        selection.value = newSelection;
        instance.emit('selection-change', newSelection.slice());
      }
    };

    const toggleRowSelection = (row, selected, emitChange = true) => {
      const changed = toggleRowStatus(selection.value, row, selected);

      if (changed) {
        const newSelection = (selection.value || []).slice(); // 调用 API 修改选中值，不触发 select 事件

        if (emitChange) {
          instance.emit('select', newSelection, row);
        }

        instance.emit('selection-change', newSelection);
      }
    };

    const _toggleAllSelection = () => {
      // when only some rows are selected (but not all), select or deselect all of them
      // depending on the value of selectOnIndeterminate
      const value = selectOnIndeterminate.value ? !isAllSelected.value : !(isAllSelected.value || selection.value.length);
      isAllSelected.value = value;
      let selectionChanged = false;
      data.value.forEach((row, index) => {
        if (selectable.value) {
          if (selectable.value.call(null, row, index) && toggleRowStatus(selection.value, row, value)) {
            selectionChanged = true;
          }
        } else {
          if (toggleRowStatus(selection.value, row, value)) {
            selectionChanged = true;
          }
        }
      });

      if (selectionChanged) {
        instance.emit('selection-change', selection.value ? selection.value.slice() : []);
      }

      instance.emit('select-all', selection.value);
    };

    const updateSelectionByRowKey = () => {
      const selectedMap = getKeysMap(selection.value, rowKey.value);
      data.value.forEach(row => {
        const rowId = getRowIdentity(row, rowKey.value);
        const rowInfo = selectedMap[rowId];

        if (rowInfo) {
          selection.value[rowInfo.index] = row;
        }
      });
    };

    const updateAllSelected = () => {
      var _data$value;

      // data 为 null 时，解构时的默认值会被忽略
      if (((_data$value = data.value) === null || _data$value === void 0 ? void 0 : _data$value.length) === 0) {
        isAllSelected.value = false;
        return;
      }

      let selectedMap;

      if (rowKey.value) {
        selectedMap = getKeysMap(selection.value, rowKey.value);
      }

      const isSelected = function (row) {
        if (selectedMap) {
          return !!selectedMap[getRowIdentity(row, rowKey.value)];
        } else {
          return selection.value.indexOf(row) !== -1;
        }
      };

      let isAllSelected_ = true;
      let selectedCount = 0;

      for (let i = 0, j = (data.value || []).length; i < j; i++) {
        const item = data.value[i];
        const isRowSelectable = selectable.value && selectable.value.call(null, item, i);

        if (!isSelected(item)) {
          if (!selectable.value || isRowSelectable) {
            isAllSelected_ = false;
            break;
          }
        } else {
          selectedCount++;
        }
      }

      if (selectedCount === 0) isAllSelected_ = false;
      isAllSelected.value = isAllSelected_;
    }; // 过滤与排序


    const updateFilters = (columns, values) => {
      if (!Array.isArray(columns)) {
        columns = [columns];
      }

      const filters_ = {};
      columns.forEach(col => {
        filters.value[col.id] = values;
        filters_[col.columnKey || col.id] = values;
      });
      return filters_;
    };

    const updateSort = (column, prop, order) => {
      if (sortingColumn.value && sortingColumn.value !== column) {
        sortingColumn.value.order = null;
      }

      sortingColumn.value = column;
      sortProp.value = prop;
      sortOrder.value = order;
    };

    const execFilter = () => {
      let sourceData = vue.unref(_data);
      Object.keys(filters.value).forEach(columnId => {
        const values = filters.value[columnId];
        if (!values || values.length === 0) return;
        const column = getColumnById({
          columns: columns.value
        }, columnId);

        if (column && column.filterMethod) {
          sourceData = sourceData.filter(row => {
            return values.some(value => column.filterMethod.call(null, value, row, column));
          });
        }
      });
      filteredData.value = sourceData;
    };

    const execSort = () => {
      data.value = sortData(filteredData.value, {
        sortingColumn: sortingColumn.value,
        sortProp: sortProp.value,
        sortOrder: sortOrder.value
      });
    }; // 根据 filters 与 sort 去过滤 data


    const execQuery = ignore => {
      if (!(ignore && ignore.filter)) {
        execFilter();
      }

      execSort();
    };

    const clearFilter = columnKeys => {
      const {
        tableHeader,
        fixedTableHeader,
        rightFixedTableHeader
      } = instance.refs;
      let panels = {};
      if (tableHeader) panels = merge(panels, tableHeader.filterPanels);
      if (fixedTableHeader) panels = merge(panels, fixedTableHeader.filterPanels);
      if (rightFixedTableHeader) panels = merge(panels, rightFixedTableHeader.filterPanels);
      const keys = Object.keys(panels);
      if (!keys.length) return;

      if (typeof columnKeys === 'string') {
        columnKeys = [columnKeys];
      }

      if (Array.isArray(columnKeys)) {
        const columns_ = columnKeys.map(key => getColumnByKey({
          columns: columns.value
        }, key));
        keys.forEach(key => {
          const column = columns_.find(col => col.id === key);

          if (column) {
            column.filteredValue = [];
          }
        });
        instance.store.commit('filterChange', {
          column: columns_,
          values: [],
          silent: true,
          multi: true
        });
      } else {
        keys.forEach(key => {
          const column = columns.value.find(col => col.id === key);

          if (column) {
            column.filteredValue = [];
          }
        });
        filters.value = {};
        instance.store.commit('filterChange', {
          column: {},
          values: [],
          silent: true
        });
      }
    };

    const clearSort = () => {
      if (!sortingColumn.value) return;
      updateSort(null, null, null);
      instance.store.commit('changeSortCondition', {
        silent: true
      });
    };

    const {
      setExpandRowKeys,
      toggleRowExpansion,
      updateExpandRows,
      states: expandStates,
      isRowExpanded
    } = useExpand$1({
      data,
      rowKey
    });
    const {
      updateTreeExpandKeys,
      toggleTreeExpansion,
      loadOrToggle,
      states: treeStates
    } = useTree({
      data,
      rowKey
    });
    const {
      updateCurrentRowData,
      updateCurrentRow,
      setCurrentRowKey,
      states: currentData
    } = useCurrent({
      data,
      rowKey
    }); // 适配层，expand-row-keys 在 Expand 与 TreeTable 中都有使用

    const setExpandRowKeysAdapter = val => {
      // 这里会触发额外的计算，但为了兼容性，暂时这么做
      setExpandRowKeys(val);
      updateTreeExpandKeys(val);
    }; // 展开行与 TreeTable 都要使用


    const toggleRowExpansionAdapter = (row, expanded) => {
      const hasExpandColumn = columns.value.some(({
        type
      }) => type === 'expand');

      if (hasExpandColumn) {
        toggleRowExpansion(row, expanded);
      } else {
        toggleTreeExpansion(row, expanded);
      }
    };

    return {
      assertRowKey,
      updateColumns,
      scheduleLayout,
      isSelected,
      clearSelection,
      cleanSelection,
      toggleRowSelection,
      _toggleAllSelection,
      updateSelectionByRowKey,
      updateAllSelected,
      updateFilters,
      updateCurrentRow,
      updateSort,
      execFilter,
      execSort,
      execQuery,
      clearFilter,
      clearSort,
      toggleRowExpansion,
      setExpandRowKeysAdapter,
      setCurrentRowKey,
      toggleRowExpansionAdapter,
      isRowExpanded,
      updateExpandRows,
      updateCurrentRowData,
      loadOrToggle,
      states: {
        rowKey,
        data,
        _data,
        isComplex,
        _columns,
        originColumns,
        columns,
        fixedColumns,
        rightFixedColumns,
        leafColumns,
        fixedLeafColumns,
        rightFixedLeafColumns,
        leafColumnsLength,
        fixedLeafColumnsLength,
        rightFixedLeafColumnsLength,
        isAllSelected,
        selection,
        reserveSelection,
        selectOnIndeterminate,
        selectable,
        filters,
        filteredData,
        sortingColumn,
        sortProp,
        sortOrder,
        hoverRow,
        ...expandStates,
        ...treeStates,
        ...currentData
      }
    };
  }

  function replaceColumn(array, column) {
    return array.map(item => {
      var _item$children;

      if (item.id === column.id) {
        return column;
      } else if (((_item$children = item.children) === null || _item$children === void 0 ? void 0 : _item$children.length) > 0) {
        item.children = replaceColumn(item.children, column);
      }

      return item;
    });
  }

  function useStore() {
    const instance = vue.getCurrentInstance();
    const mutations = {
      setData(states, data) {
        const dataInstanceChanged = vue.unref(states.data) !== data;
        states.data.value = data;
        states._data.value = data;
        instance.store.execQuery(); // 数据变化，更新部分数据。
        // 没有使用 computed，而是手动更新部分数据 https://github.com/vuejs/vue/issues/6660#issuecomment-331417140

        instance.store.updateCurrentRowData();
        instance.store.updateExpandRows();

        if (vue.unref(states.reserveSelection)) {
          instance.store.assertRowKey();
          instance.store.updateSelectionByRowKey();
        } else {
          if (dataInstanceChanged) {
            instance.store.clearSelection();
          } else {
            instance.store.cleanSelection();
          }
        }

        instance.store.updateAllSelected();
        instance.store.updateTableScrollY();
      },

      insertColumn(states, column, index, parent) {
        if (index < -1) return;
        const array = vue.unref(states._columns);

        if (!parent) {
          array.splice(index, 0, column);
          states._columns.value = array;
        } else {
          if (parent && !parent.children) {
            parent.children = [];
          }

          parent.children.push(column);
          const newColumns = replaceColumn(array, parent);
          states._columns.value = newColumns;
        }

        if (column.type === 'selection') {
          states.selectable.value = column.selectable;
          states.reserveSelection.value = column.reserveSelection;
        }

        if (instance.$ready) {
          instance.store.updateColumns(); // hack for dynamics insert column

          instance.store.scheduleLayout();
        }
      },

      removeColumn(states, column, parent) {
        const array = vue.unref(states._columns) || [];

        if (parent) {
          parent.children.splice(parent.children.findIndex(item => item.id === column.id), 1);
          states._columns.value = replaceColumn(array, parent);
        } else {
          array.splice(array.indexOf(column), 1);
          states._columns.value = array;
        }

        if (instance.$ready) {
          instance.store.updateColumns(); // hack for dynamics remove column

          instance.store.scheduleLayout();
        }
      },

      sort(states, options) {
        const {
          prop,
          order,
          init
        } = options;

        if (prop) {
          const column = arrayFind(vue.unref(states.columns), column => column.property === prop);

          if (column) {
            column.order = order;
            instance.store.updateSort(column, prop, order);
            instance.store.commit('changeSortCondition', {
              init
            });
          }
        }
      },

      changeSortCondition(states, options) {
        // 修复 pr https://github.com/ElemeFE/element/pull/15012 导致的 bug
        const {
          sortingColumn: column,
          sortProp: prop,
          sortOrder: order
        } = states;

        if (vue.unref(order) === null) {
          states.sortingColumn.value = null;
          states.sortProp.value = null;
        }

        const ingore = {
          filter: true
        };
        instance.store.execQuery(ingore);

        if (!options || !(options.silent || options.init)) {
          instance.emit('sort-change', {
            column: vue.unref(column),
            prop: vue.unref(prop),
            order: vue.unref(order)
          });
        }

        instance.store.updateTableScrollY();
      },

      filterChange(states, options) {
        const {
          column,
          values,
          silent
        } = options;
        const newFilters = instance.store.updateFilters(column, values);
        instance.store.execQuery();

        if (!silent) {
          instance.emit('filter-change', newFilters);
        }

        instance.store.updateTableScrollY();
      },

      toggleAllSelection() {
        instance.store.toggleAllSelection();
      },

      rowSelectedChanged(states, row) {
        instance.store.toggleRowSelection(row);
        instance.store.updateAllSelected();
      },

      setHoverRow(states, row) {
        states.hoverRow.value = row;
      },

      setCurrentRow(states, row) {
        instance.store.updateCurrentRow(row);
      }

    };

    const commit = function (name, ...args) {
      const mutations = instance.store.mutations;

      if (mutations[name]) {
        mutations[name].apply(instance, [instance.store.states].concat(args));
      } else {
        throw new Error(`Action not found: ${name}`);
      }
    };

    const updateTableScrollY = function () {
      vue.nextTick(instance.layout.updateScrollY.apply(instance.layout));
    };

    const watcher = useWatcher$1();
    return { ...watcher,
      mutations,
      commit,
      updateTableScrollY
    };
  }

  /** Detect free variable `global` from Node.js. */
  var freeGlobal = typeof global == 'object' && global && global.Object === Object && global;

  /** Detect free variable `self`. */

  var freeSelf = typeof self == 'object' && self && self.Object === Object && self;
  /** Used as a reference to the global object. */

  var root = freeGlobal || freeSelf || Function('return this')();

  /** Built-in value references. */

  var Symbol$1 = root.Symbol;

  /** Used for built-in method references. */

  var objectProto$1 = Object.prototype;
  /** Used to check objects for own properties. */

  var hasOwnProperty = objectProto$1.hasOwnProperty;
  /**
   * Used to resolve the
   * [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring)
   * of values.
   */

  var nativeObjectToString$1 = objectProto$1.toString;
  /** Built-in value references. */

  var symToStringTag$1 = Symbol$1 ? Symbol$1.toStringTag : undefined;
  /**
   * A specialized version of `baseGetTag` which ignores `Symbol.toStringTag` values.
   *
   * @private
   * @param {*} value The value to query.
   * @returns {string} Returns the raw `toStringTag`.
   */

  function getRawTag(value) {
    var isOwn = hasOwnProperty.call(value, symToStringTag$1),
        tag = value[symToStringTag$1];

    try {
      value[symToStringTag$1] = undefined;
      var unmasked = true;
    } catch (e) {}

    var result = nativeObjectToString$1.call(value);

    if (unmasked) {
      if (isOwn) {
        value[symToStringTag$1] = tag;
      } else {
        delete value[symToStringTag$1];
      }
    }

    return result;
  }

  /** Used for built-in method references. */
  var objectProto = Object.prototype;
  /**
   * Used to resolve the
   * [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring)
   * of values.
   */

  var nativeObjectToString = objectProto.toString;
  /**
   * Converts `value` to a string using `Object.prototype.toString`.
   *
   * @private
   * @param {*} value The value to convert.
   * @returns {string} Returns the converted string.
   */

  function objectToString(value) {
    return nativeObjectToString.call(value);
  }

  /** `Object#toString` result references. */

  var nullTag = '[object Null]',
      undefinedTag = '[object Undefined]';
  /** Built-in value references. */

  var symToStringTag = Symbol$1 ? Symbol$1.toStringTag : undefined;
  /**
   * The base implementation of `getTag` without fallbacks for buggy environments.
   *
   * @private
   * @param {*} value The value to query.
   * @returns {string} Returns the `toStringTag`.
   */

  function baseGetTag(value) {
    if (value == null) {
      return value === undefined ? undefinedTag : nullTag;
    }

    return symToStringTag && symToStringTag in Object(value) ? getRawTag(value) : objectToString(value);
  }

  /**
   * Checks if `value` is object-like. A value is object-like if it's not `null`
   * and has a `typeof` result of "object".
   *
   * @static
   * @memberOf _
   * @since 4.0.0
   * @category Lang
   * @param {*} value The value to check.
   * @returns {boolean} Returns `true` if `value` is object-like, else `false`.
   * @example
   *
   * _.isObjectLike({});
   * // => true
   *
   * _.isObjectLike([1, 2, 3]);
   * // => true
   *
   * _.isObjectLike(_.noop);
   * // => false
   *
   * _.isObjectLike(null);
   * // => false
   */
  function isObjectLike(value) {
    return value != null && typeof value == 'object';
  }

  /** `Object#toString` result references. */

  var symbolTag = '[object Symbol]';
  /**
   * Checks if `value` is classified as a `Symbol` primitive or object.
   *
   * @static
   * @memberOf _
   * @since 4.0.0
   * @category Lang
   * @param {*} value The value to check.
   * @returns {boolean} Returns `true` if `value` is a symbol, else `false`.
   * @example
   *
   * _.isSymbol(Symbol.iterator);
   * // => true
   *
   * _.isSymbol('abc');
   * // => false
   */

  function isSymbol(value) {
    return typeof value == 'symbol' || isObjectLike(value) && baseGetTag(value) == symbolTag;
  }

  /** Used to match a single whitespace character. */
  var reWhitespace = /\s/;
  /**
   * Used by `_.trim` and `_.trimEnd` to get the index of the last non-whitespace
   * character of `string`.
   *
   * @private
   * @param {string} string The string to inspect.
   * @returns {number} Returns the index of the last non-whitespace character.
   */

  function trimmedEndIndex(string) {
    var index = string.length;

    while (index-- && reWhitespace.test(string.charAt(index))) {}

    return index;
  }

  /** Used to match leading whitespace. */

  var reTrimStart = /^\s+/;
  /**
   * The base implementation of `_.trim`.
   *
   * @private
   * @param {string} string The string to trim.
   * @returns {string} Returns the trimmed string.
   */

  function baseTrim(string) {
    return string ? string.slice(0, trimmedEndIndex(string) + 1).replace(reTrimStart, '') : string;
  }

  /**
   * Checks if `value` is the
   * [language type](http://www.ecma-international.org/ecma-262/7.0/#sec-ecmascript-language-types)
   * of `Object`. (e.g. arrays, functions, objects, regexes, `new Number(0)`, and `new String('')`)
   *
   * @static
   * @memberOf _
   * @since 0.1.0
   * @category Lang
   * @param {*} value The value to check.
   * @returns {boolean} Returns `true` if `value` is an object, else `false`.
   * @example
   *
   * _.isObject({});
   * // => true
   *
   * _.isObject([1, 2, 3]);
   * // => true
   *
   * _.isObject(_.noop);
   * // => true
   *
   * _.isObject(null);
   * // => false
   */
  function isObject(value) {
    var type = typeof value;
    return value != null && (type == 'object' || type == 'function');
  }

  /** Used as references for various `Number` constants. */

  var NAN = 0 / 0;
  /** Used to detect bad signed hexadecimal string values. */

  var reIsBadHex = /^[-+]0x[0-9a-f]+$/i;
  /** Used to detect binary string values. */

  var reIsBinary = /^0b[01]+$/i;
  /** Used to detect octal string values. */

  var reIsOctal = /^0o[0-7]+$/i;
  /** Built-in method references without a dependency on `root`. */

  var freeParseInt = parseInt;
  /**
   * Converts `value` to a number.
   *
   * @static
   * @memberOf _
   * @since 4.0.0
   * @category Lang
   * @param {*} value The value to process.
   * @returns {number} Returns the number.
   * @example
   *
   * _.toNumber(3.2);
   * // => 3.2
   *
   * _.toNumber(Number.MIN_VALUE);
   * // => 5e-324
   *
   * _.toNumber(Infinity);
   * // => Infinity
   *
   * _.toNumber('3.2');
   * // => 3.2
   */

  function toNumber(value) {
    if (typeof value == 'number') {
      return value;
    }

    if (isSymbol(value)) {
      return NAN;
    }

    if (isObject(value)) {
      var other = typeof value.valueOf == 'function' ? value.valueOf() : value;
      value = isObject(other) ? other + '' : other;
    }

    if (typeof value != 'string') {
      return value === 0 ? value : +value;
    }

    value = baseTrim(value);
    var isBinary = reIsBinary.test(value);
    return isBinary || reIsOctal.test(value) ? freeParseInt(value.slice(2), isBinary ? 2 : 8) : reIsBadHex.test(value) ? NAN : +value;
  }

  /**
   * Gets the timestamp of the number of milliseconds that have elapsed since
   * the Unix epoch (1 January 1970 00:00:00 UTC).
   *
   * @static
   * @memberOf _
   * @since 2.4.0
   * @category Date
   * @returns {number} Returns the timestamp.
   * @example
   *
   * _.defer(function(stamp) {
   *   console.log(_.now() - stamp);
   * }, _.now());
   * // => Logs the number of milliseconds it took for the deferred invocation.
   */

  var now = function () {
    return root.Date.now();
  };

  /** Error message constants. */

  var FUNC_ERROR_TEXT$1 = 'Expected a function';
  /* Built-in method references for those with the same name as other `lodash` methods. */

  var nativeMax = Math.max,
      nativeMin = Math.min;
  /**
   * Creates a debounced function that delays invoking `func` until after `wait`
   * milliseconds have elapsed since the last time the debounced function was
   * invoked. The debounced function comes with a `cancel` method to cancel
   * delayed `func` invocations and a `flush` method to immediately invoke them.
   * Provide `options` to indicate whether `func` should be invoked on the
   * leading and/or trailing edge of the `wait` timeout. The `func` is invoked
   * with the last arguments provided to the debounced function. Subsequent
   * calls to the debounced function return the result of the last `func`
   * invocation.
   *
   * **Note:** If `leading` and `trailing` options are `true`, `func` is
   * invoked on the trailing edge of the timeout only if the debounced function
   * is invoked more than once during the `wait` timeout.
   *
   * If `wait` is `0` and `leading` is `false`, `func` invocation is deferred
   * until to the next tick, similar to `setTimeout` with a timeout of `0`.
   *
   * See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)
   * for details over the differences between `_.debounce` and `_.throttle`.
   *
   * @static
   * @memberOf _
   * @since 0.1.0
   * @category Function
   * @param {Function} func The function to debounce.
   * @param {number} [wait=0] The number of milliseconds to delay.
   * @param {Object} [options={}] The options object.
   * @param {boolean} [options.leading=false]
   *  Specify invoking on the leading edge of the timeout.
   * @param {number} [options.maxWait]
   *  The maximum time `func` is allowed to be delayed before it's invoked.
   * @param {boolean} [options.trailing=true]
   *  Specify invoking on the trailing edge of the timeout.
   * @returns {Function} Returns the new debounced function.
   * @example
   *
   * // Avoid costly calculations while the window size is in flux.
   * jQuery(window).on('resize', _.debounce(calculateLayout, 150));
   *
   * // Invoke `sendMail` when clicked, debouncing subsequent calls.
   * jQuery(element).on('click', _.debounce(sendMail, 300, {
   *   'leading': true,
   *   'trailing': false
   * }));
   *
   * // Ensure `batchLog` is invoked once after 1 second of debounced calls.
   * var debounced = _.debounce(batchLog, 250, { 'maxWait': 1000 });
   * var source = new EventSource('/stream');
   * jQuery(source).on('message', debounced);
   *
   * // Cancel the trailing debounced invocation.
   * jQuery(window).on('popstate', debounced.cancel);
   */

  function debounce(func, wait, options) {
    var lastArgs,
        lastThis,
        maxWait,
        result,
        timerId,
        lastCallTime,
        lastInvokeTime = 0,
        leading = false,
        maxing = false,
        trailing = true;

    if (typeof func != 'function') {
      throw new TypeError(FUNC_ERROR_TEXT$1);
    }

    wait = toNumber(wait) || 0;

    if (isObject(options)) {
      leading = !!options.leading;
      maxing = 'maxWait' in options;
      maxWait = maxing ? nativeMax(toNumber(options.maxWait) || 0, wait) : maxWait;
      trailing = 'trailing' in options ? !!options.trailing : trailing;
    }

    function invokeFunc(time) {
      var args = lastArgs,
          thisArg = lastThis;
      lastArgs = lastThis = undefined;
      lastInvokeTime = time;
      result = func.apply(thisArg, args);
      return result;
    }

    function leadingEdge(time) {
      // Reset any `maxWait` timer.
      lastInvokeTime = time; // Start the timer for the trailing edge.

      timerId = setTimeout(timerExpired, wait); // Invoke the leading edge.

      return leading ? invokeFunc(time) : result;
    }

    function remainingWait(time) {
      var timeSinceLastCall = time - lastCallTime,
          timeSinceLastInvoke = time - lastInvokeTime,
          timeWaiting = wait - timeSinceLastCall;
      return maxing ? nativeMin(timeWaiting, maxWait - timeSinceLastInvoke) : timeWaiting;
    }

    function shouldInvoke(time) {
      var timeSinceLastCall = time - lastCallTime,
          timeSinceLastInvoke = time - lastInvokeTime; // Either this is the first call, activity has stopped and we're at the
      // trailing edge, the system time has gone backwards and we're treating
      // it as the trailing edge, or we've hit the `maxWait` limit.

      return lastCallTime === undefined || timeSinceLastCall >= wait || timeSinceLastCall < 0 || maxing && timeSinceLastInvoke >= maxWait;
    }

    function timerExpired() {
      var time = now();

      if (shouldInvoke(time)) {
        return trailingEdge(time);
      } // Restart the timer.


      timerId = setTimeout(timerExpired, remainingWait(time));
    }

    function trailingEdge(time) {
      timerId = undefined; // Only invoke if we have `lastArgs` which means `func` has been
      // debounced at least once.

      if (trailing && lastArgs) {
        return invokeFunc(time);
      }

      lastArgs = lastThis = undefined;
      return result;
    }

    function cancel() {
      if (timerId !== undefined) {
        clearTimeout(timerId);
      }

      lastInvokeTime = 0;
      lastArgs = lastCallTime = lastThis = timerId = undefined;
    }

    function flush() {
      return timerId === undefined ? result : trailingEdge(now());
    }

    function debounced() {
      var time = now(),
          isInvoking = shouldInvoke(time);
      lastArgs = arguments;
      lastThis = this;
      lastCallTime = time;

      if (isInvoking) {
        if (timerId === undefined) {
          return leadingEdge(lastCallTime);
        }

        if (maxing) {
          // Handle invocations in a tight loop.
          clearTimeout(timerId);
          timerId = setTimeout(timerExpired, wait);
          return invokeFunc(lastCallTime);
        }
      }

      if (timerId === undefined) {
        timerId = setTimeout(timerExpired, wait);
      }

      return result;
    }

    debounced.cancel = cancel;
    debounced.flush = flush;
    return debounced;
  }

  /** Error message constants. */

  var FUNC_ERROR_TEXT = 'Expected a function';
  /**
   * Creates a throttled function that only invokes `func` at most once per
   * every `wait` milliseconds. The throttled function comes with a `cancel`
   * method to cancel delayed `func` invocations and a `flush` method to
   * immediately invoke them. Provide `options` to indicate whether `func`
   * should be invoked on the leading and/or trailing edge of the `wait`
   * timeout. The `func` is invoked with the last arguments provided to the
   * throttled function. Subsequent calls to the throttled function return the
   * result of the last `func` invocation.
   *
   * **Note:** If `leading` and `trailing` options are `true`, `func` is
   * invoked on the trailing edge of the timeout only if the throttled function
   * is invoked more than once during the `wait` timeout.
   *
   * If `wait` is `0` and `leading` is `false`, `func` invocation is deferred
   * until to the next tick, similar to `setTimeout` with a timeout of `0`.
   *
   * See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)
   * for details over the differences between `_.throttle` and `_.debounce`.
   *
   * @static
   * @memberOf _
   * @since 0.1.0
   * @category Function
   * @param {Function} func The function to throttle.
   * @param {number} [wait=0] The number of milliseconds to throttle invocations to.
   * @param {Object} [options={}] The options object.
   * @param {boolean} [options.leading=true]
   *  Specify invoking on the leading edge of the timeout.
   * @param {boolean} [options.trailing=true]
   *  Specify invoking on the trailing edge of the timeout.
   * @returns {Function} Returns the new throttled function.
   * @example
   *
   * // Avoid excessively updating the position while scrolling.
   * jQuery(window).on('scroll', _.throttle(updatePosition, 100));
   *
   * // Invoke `renewToken` when the click event is fired, but not more than once every 5 minutes.
   * var throttled = _.throttle(renewToken, 300000, { 'trailing': false });
   * jQuery(element).on('click', throttled);
   *
   * // Cancel the trailing throttled invocation.
   * jQuery(window).on('popstate', throttled.cancel);
   */

  function throttle(func, wait, options) {
    var leading = true,
        trailing = true;

    if (typeof func != 'function') {
      throw new TypeError(FUNC_ERROR_TEXT);
    }

    if (isObject(options)) {
      leading = 'leading' in options ? !!options.leading : leading;
      trailing = 'trailing' in options ? !!options.trailing : trailing;
    }

    return debounce(func, wait, {
      'leading': leading,
      'maxWait': wait,
      'trailing': trailing
    });
  }

  function createStore(table, initialState = {}) {
    if (!table) {
      throw new Error('Table is required.');
    }

    const store = useStore(); // fix https://github.com/ElemeFE/element/issues/14075
    // related pr https://github.com/ElemeFE/element/pull/14146

    store.toggleAllSelection = debounce(store._toggleAllSelection, 10);
    Object.keys(initialState).forEach(key => {
      store.states[key].value = initialState[key];
    });
    return store;
  }

  /**
   * Copyright 2004-present Facebook. All Rights Reserved.
   *
   * @providesModule UserAgent_DEPRECATED
   */
  /**
   *  Provides entirely client-side User Agent and OS detection. You should prefer
   *  the non-deprecated UserAgent module when possible, which exposes our
   *  authoritative server-side PHP-based detection to the client.
   *
   *  Usage is straightforward:
   *
   *    if (UserAgent_DEPRECATED.ie()) {
   *      //  IE
   *    }
   *
   *  You can also do version checks:
   *
   *    if (UserAgent_DEPRECATED.ie() >= 7) {
   *      //  IE7 or better
   *    }
   *
   *  The browser functions will return NaN if the browser does not match, so
   *  you can also do version compares the other way:
   *
   *    if (UserAgent_DEPRECATED.ie() < 7) {
   *      //  IE6 or worse
   *    }
   *
   *  Note that the version is a float and may include a minor version number,
   *  so you should always use range operators to perform comparisons, not
   *  strict equality.
   *
   *  **Note:** You should **strongly** prefer capability detection to browser
   *  version detection where it's reasonable:
   *
   *    http://www.quirksmode.org/js/support.html
   *
   *  Further, we have a large number of mature wrapper functions and classes
   *  which abstract away many browser irregularities. Check the documentation,
   *  grep for things, or ask on javascript@lists.facebook.com before writing yet
   *  another copy of "event || window.event".
   *
   */
  var _populated = false; // Browsers

  var _ie, _firefox, _opera, _webkit, _chrome; // Actual IE browser for compatibility mode


  var _ie_real_version; // Platforms


  var _osx, _windows, _linux, _android; // Architectures


  var _win64; // Devices


  var _iphone, _ipad, _native;

  var _mobile;

  function _populate() {
    if (_populated) {
      return;
    }

    _populated = true; // To work around buggy JS libraries that can't handle multi-digit
    // version numbers, Opera 10's user agent string claims it's Opera
    // 9, then later includes a Version/X.Y field:
    //
    // Opera/9.80 (foo) Presto/2.2.15 Version/10.10

    var uas = navigator.userAgent;
    var agent = /(?:MSIE.(\d+\.\d+))|(?:(?:Firefox|GranParadiso|Iceweasel).(\d+\.\d+))|(?:Opera(?:.+Version.|.)(\d+\.\d+))|(?:AppleWebKit.(\d+(?:\.\d+)?))|(?:Trident\/\d+\.\d+.*rv:(\d+\.\d+))/.exec(uas);
    var os = /(Mac OS X)|(Windows)|(Linux)/.exec(uas);
    _iphone = /\b(iPhone|iP[ao]d)/.exec(uas);
    _ipad = /\b(iP[ao]d)/.exec(uas);
    _android = /Android/i.exec(uas);
    _native = /FBAN\/\w+;/i.exec(uas);
    _mobile = /Mobile/i.exec(uas); // Note that the IE team blog would have you believe you should be checking
    // for 'Win64; x64'.  But MSDN then reveals that you can actually be coming
    // from either x64 or ia64;  so ultimately, you should just check for Win64
    // as in indicator of whether you're in 64-bit IE.  32-bit IE on 64-bit
    // Windows will send 'WOW64' instead.

    _win64 = !!/Win64/.exec(uas);

    if (agent) {
      _ie = agent[1] ? parseFloat(agent[1]) : agent[5] ? parseFloat(agent[5]) : NaN; // IE compatibility mode

      if (_ie && document && document.documentMode) {
        _ie = document.documentMode;
      } // grab the "true" ie version from the trident token if available


      var trident = /(?:Trident\/(\d+.\d+))/.exec(uas);
      _ie_real_version = trident ? parseFloat(trident[1]) + 4 : _ie;
      _firefox = agent[2] ? parseFloat(agent[2]) : NaN;
      _opera = agent[3] ? parseFloat(agent[3]) : NaN;
      _webkit = agent[4] ? parseFloat(agent[4]) : NaN;

      if (_webkit) {
        // We do not add the regexp to the above test, because it will always
        // match 'safari' only since 'AppleWebKit' appears before 'Chrome' in
        // the userAgent string.
        agent = /(?:Chrome\/(\d+\.\d+))/.exec(uas);
        _chrome = agent && agent[1] ? parseFloat(agent[1]) : NaN;
      } else {
        _chrome = NaN;
      }
    } else {
      _ie = _firefox = _opera = _chrome = _webkit = NaN;
    }

    if (os) {
      if (os[1]) {
        // Detect OS X version.  If no version number matches, set _osx to true.
        // Version examples:  10, 10_6_1, 10.7
        // Parses version number as a float, taking only first two sets of
        // digits.  If only one set of digits is found, returns just the major
        // version number.
        var ver = /(?:Mac OS X (\d+(?:[._]\d+)?))/.exec(uas);
        _osx = ver ? parseFloat(ver[1].replace('_', '.')) : true;
      } else {
        _osx = false;
      }

      _windows = !!os[2];
      _linux = !!os[3];
    } else {
      _osx = _windows = _linux = false;
    }
  }

  var UserAgent_DEPRECATED = {
    /**
     *  Check if the UA is Internet Explorer.
     *
     *
     *  @return float|NaN Version number (if match) or NaN.
     */
    ie: function () {
      return _populate() || _ie;
    },

    /**
     * Check if we're in Internet Explorer compatibility mode.
     *
     * @return bool true if in compatibility mode, false if
     * not compatibility mode or not ie
     */
    ieCompatibilityMode: function () {
      return _populate() || _ie_real_version > _ie;
    },

    /**
     * Whether the browser is 64-bit IE.  Really, this is kind of weak sauce;  we
     * only need this because Skype can't handle 64-bit IE yet.  We need to remove
     * this when we don't need it -- tracked by #601957.
     */
    ie64: function () {
      return UserAgent_DEPRECATED.ie() && _win64;
    },

    /**
     *  Check if the UA is Firefox.
     *
     *
     *  @return float|NaN Version number (if match) or NaN.
     */
    firefox: function () {
      return _populate() || _firefox;
    },

    /**
     *  Check if the UA is Opera.
     *
     *
     *  @return float|NaN Version number (if match) or NaN.
     */
    opera: function () {
      return _populate() || _opera;
    },

    /**
     *  Check if the UA is WebKit.
     *
     *
     *  @return float|NaN Version number (if match) or NaN.
     */
    webkit: function () {
      return _populate() || _webkit;
    },

    /**
     *  For Push
     *  WILL BE REMOVED VERY SOON. Use UserAgent_DEPRECATED.webkit
     */
    safari: function () {
      return UserAgent_DEPRECATED.webkit();
    },

    /**
     *  Check if the UA is a Chrome browser.
     *
     *
     *  @return float|NaN Version number (if match) or NaN.
     */
    chrome: function () {
      return _populate() || _chrome;
    },

    /**
     *  Check if the user is running Windows.
     *
     *  @return bool `true' if the user's OS is Windows.
     */
    windows: function () {
      return _populate() || _windows;
    },

    /**
     *  Check if the user is running Mac OS X.
     *
     *  @return float|bool   Returns a float if a version number is detected,
     *                       otherwise true/false.
     */
    osx: function () {
      return _populate() || _osx;
    },

    /**
     * Check if the user is running Linux.
     *
     * @return bool `true' if the user's OS is some flavor of Linux.
     */
    linux: function () {
      return _populate() || _linux;
    },

    /**
     * Check if the user is running on an iPhone or iPod platform.
     *
     * @return bool `true' if the user is running some flavor of the
     *    iPhone OS.
     */
    iphone: function () {
      return _populate() || _iphone;
    },
    mobile: function () {
      return _populate() || _iphone || _ipad || _android || _mobile;
    },
    nativeApp: function () {
      // webviews inside of the native apps
      return _populate() || _native;
    },
    android: function () {
      return _populate() || _android;
    },
    ipad: function () {
      return _populate() || _ipad;
    }
  };
  var UserAgent_DEPRECATED_1 = UserAgent_DEPRECATED;

  /**
   * Copyright (c) 2015, Facebook, Inc.
   * All rights reserved.
   *
   * This source code is licensed under the BSD-style license found in the
   * LICENSE file in the root directory of this source tree. An additional grant
   * of patent rights can be found in the PATENTS file in the same directory.
   *
   * @providesModule ExecutionEnvironment
   */

  var canUseDOM = !!(typeof window !== 'undefined' && window.document && window.document.createElement);
  /**
   * Simple, lightweight module assisting with the detection and context of
   * Worker. Helps avoid circular dependencies and allows code to reason about
   * whether or not they are in a Worker, even if they never include the main
   * `ReactWorker` dependency.
   */

  var ExecutionEnvironment = {
    canUseDOM: canUseDOM,
    canUseWorkers: typeof Worker !== 'undefined',
    canUseEventListeners: canUseDOM && !!(window.addEventListener || window.attachEvent),
    canUseViewport: canUseDOM && !!window.screen,
    isInWorker: !canUseDOM // For now, this is true - might change in the future.

  };
  var ExecutionEnvironment_1 = ExecutionEnvironment;

  /**
   * Copyright 2013-2015, Facebook, Inc.
   * All rights reserved.
   *
   * This source code is licensed under the BSD-style license found in the
   * LICENSE file in the root directory of this source tree. An additional grant
   * of patent rights can be found in the PATENTS file in the same directory.
   *
   * @providesModule isEventSupported
   */



  var useHasFeature;

  if (ExecutionEnvironment_1.canUseDOM) {
    useHasFeature = document.implementation && document.implementation.hasFeature && // always returns true in newer browsers as per the standard.
    // @see http://dom.spec.whatwg.org/#dom-domimplementation-hasfeature
    document.implementation.hasFeature('', '') !== true;
  }
  /**
   * Checks if an event is supported in the current execution environment.
   *
   * NOTE: This will not work correctly for non-generic events such as `change`,
   * `reset`, `load`, `error`, and `select`.
   *
   * Borrows from Modernizr.
   *
   * @param {string} eventNameSuffix Event name, e.g. "click".
   * @param {?boolean} capture Check if the capture phase is supported.
   * @return {boolean} True if the event is supported.
   * @internal
   * @license Modernizr 3.0.0pre (Custom Build) | MIT
   */


  function isEventSupported(eventNameSuffix, capture) {
    if (!ExecutionEnvironment_1.canUseDOM || capture && !('addEventListener' in document)) {
      return false;
    }

    var eventName = 'on' + eventNameSuffix;
    var isSupported = (eventName in document);

    if (!isSupported) {
      var element = document.createElement('div');
      element.setAttribute(eventName, 'return;');
      isSupported = typeof element[eventName] === 'function';
    }

    if (!isSupported && useHasFeature && eventNameSuffix === 'wheel') {
      // This is the only way to test support for the `wheel` event in IE9+.
      isSupported = document.implementation.hasFeature('Events.wheel', '3.0');
    }

    return isSupported;
  }

  var isEventSupported_1 = isEventSupported;

  /**
   * Copyright (c) 2015, Facebook, Inc.
   * All rights reserved.
   *
   * This source code is licensed under the BSD-style license found in the
   * LICENSE file in the root directory of this source tree. An additional grant
   * of patent rights can be found in the PATENTS file in the same directory.
   *
   * @providesModule normalizeWheel
   * @typechecks
   */



   // Reasonable defaults


  var PIXEL_STEP = 10;
  var LINE_HEIGHT = 40;
  var PAGE_HEIGHT = 800;
  /**
   * Mouse wheel (and 2-finger trackpad) support on the web sucks.  It is
   * complicated, thus this doc is long and (hopefully) detailed enough to answer
   * your questions.
   *
   * If you need to react to the mouse wheel in a predictable way, this code is
   * like your bestest friend. * hugs *
   *
   * As of today, there are 4 DOM event types you can listen to:
   *
   *   'wheel'                -- Chrome(31+), FF(17+), IE(9+)
   *   'mousewheel'           -- Chrome, IE(6+), Opera, Safari
   *   'MozMousePixelScroll'  -- FF(3.5 only!) (2010-2013) -- don't bother!
   *   'DOMMouseScroll'       -- FF(0.9.7+) since 2003
   *
   * So what to do?  The is the best:
   *
   *   normalizeWheel.getEventType();
   *
   * In your event callback, use this code to get sane interpretation of the
   * deltas.  This code will return an object with properties:
   *
   *   spinX   -- normalized spin speed (use for zoom) - x plane
   *   spinY   -- " - y plane
   *   pixelX  -- normalized distance (to pixels) - x plane
   *   pixelY  -- " - y plane
   *
   * Wheel values are provided by the browser assuming you are using the wheel to
   * scroll a web page by a number of lines or pixels (or pages).  Values can vary
   * significantly on different platforms and browsers, forgetting that you can
   * scroll at different speeds.  Some devices (like trackpads) emit more events
   * at smaller increments with fine granularity, and some emit massive jumps with
   * linear speed or acceleration.
   *
   * This code does its best to normalize the deltas for you:
   *
   *   - spin is trying to normalize how far the wheel was spun (or trackpad
   *     dragged).  This is super useful for zoom support where you want to
   *     throw away the chunky scroll steps on the PC and make those equal to
   *     the slow and smooth tiny steps on the Mac. Key data: This code tries to
   *     resolve a single slow step on a wheel to 1.
   *
   *   - pixel is normalizing the desired scroll delta in pixel units.  You'll
   *     get the crazy differences between browsers, but at least it'll be in
   *     pixels!
   *
   *   - positive value indicates scrolling DOWN/RIGHT, negative UP/LEFT.  This
   *     should translate to positive value zooming IN, negative zooming OUT.
   *     This matches the newer 'wheel' event.
   *
   * Why are there spinX, spinY (or pixels)?
   *
   *   - spinX is a 2-finger side drag on the trackpad, and a shift + wheel turn
   *     with a mouse.  It results in side-scrolling in the browser by default.
   *
   *   - spinY is what you expect -- it's the classic axis of a mouse wheel.
   *
   *   - I dropped spinZ/pixelZ.  It is supported by the DOM 3 'wheel' event and
   *     probably is by browsers in conjunction with fancy 3D controllers .. but
   *     you know.
   *
   * Implementation info:
   *
   * Examples of 'wheel' event if you scroll slowly (down) by one step with an
   * average mouse:
   *
   *   OS X + Chrome  (mouse)     -    4   pixel delta  (wheelDelta -120)
   *   OS X + Safari  (mouse)     -  N/A   pixel delta  (wheelDelta  -12)
   *   OS X + Firefox (mouse)     -    0.1 line  delta  (wheelDelta  N/A)
   *   Win8 + Chrome  (mouse)     -  100   pixel delta  (wheelDelta -120)
   *   Win8 + Firefox (mouse)     -    3   line  delta  (wheelDelta -120)
   *
   * On the trackpad:
   *
   *   OS X + Chrome  (trackpad)  -    2   pixel delta  (wheelDelta   -6)
   *   OS X + Firefox (trackpad)  -    1   pixel delta  (wheelDelta  N/A)
   *
   * On other/older browsers.. it's more complicated as there can be multiple and
   * also missing delta values.
   *
   * The 'wheel' event is more standard:
   *
   * http://www.w3.org/TR/DOM-Level-3-Events/#events-wheelevents
   *
   * The basics is that it includes a unit, deltaMode (pixels, lines, pages), and
   * deltaX, deltaY and deltaZ.  Some browsers provide other values to maintain
   * backward compatibility with older events.  Those other values help us
   * better normalize spin speed.  Example of what the browsers provide:
   *
   *                          | event.wheelDelta | event.detail
   *        ------------------+------------------+--------------
   *          Safari v5/OS X  |       -120       |       0
   *          Safari v5/Win7  |       -120       |       0
   *         Chrome v17/OS X  |       -120       |       0
   *         Chrome v17/Win7  |       -120       |       0
   *                IE9/Win7  |       -120       |   undefined
   *         Firefox v4/OS X  |     undefined    |       1
   *         Firefox v4/Win7  |     undefined    |       3
   *
   */

  function normalizeWheel$1(
  /*object*/
  event)
  /*object*/
  {
    var sX = 0,
        sY = 0,
        // spinX, spinY
    pX = 0,
        pY = 0; // pixelX, pixelY
    // Legacy

    if ('detail' in event) {
      sY = event.detail;
    }

    if ('wheelDelta' in event) {
      sY = -event.wheelDelta / 120;
    }

    if ('wheelDeltaY' in event) {
      sY = -event.wheelDeltaY / 120;
    }

    if ('wheelDeltaX' in event) {
      sX = -event.wheelDeltaX / 120;
    } // side scrolling on FF with DOMMouseScroll


    if ('axis' in event && event.axis === event.HORIZONTAL_AXIS) {
      sX = sY;
      sY = 0;
    }

    pX = sX * PIXEL_STEP;
    pY = sY * PIXEL_STEP;

    if ('deltaY' in event) {
      pY = event.deltaY;
    }

    if ('deltaX' in event) {
      pX = event.deltaX;
    }

    if ((pX || pY) && event.deltaMode) {
      if (event.deltaMode == 1) {
        // delta in LINE units
        pX *= LINE_HEIGHT;
        pY *= LINE_HEIGHT;
      } else {
        // delta in PAGE units
        pX *= PAGE_HEIGHT;
        pY *= PAGE_HEIGHT;
      }
    } // Fall-back if spin cannot be determined


    if (pX && !sX) {
      sX = pX < 1 ? -1 : 1;
    }

    if (pY && !sY) {
      sY = pY < 1 ? -1 : 1;
    }

    return {
      spinX: sX,
      spinY: sY,
      pixelX: pX,
      pixelY: pY
    };
  }
  /**
   * The best combination if you prefer spinX + spinY normalization.  It favors
   * the older DOMMouseScroll for Firefox, as FF does not include wheelDelta with
   * 'wheel' event, making spin speed determination impossible.
   */


  normalizeWheel$1.getEventType = function ()
  /*string*/
  {
    return UserAgent_DEPRECATED_1.firefox() ? 'DOMMouseScroll' : isEventSupported_1('wheel') ? 'wheel' : 'mousewheel';
  };

  var normalizeWheel_1 = normalizeWheel$1;

  var normalizeWheel = normalizeWheel_1;

  const mousewheelEventName$1 = isFirefox() ? 'DOMMouseScroll' : 'mousewheel';

  const mousewheel = function (element, callback) {
    if (element && element.addEventListener) {
      element.addEventListener(mousewheelEventName$1, function (event) {
        const normalized = normalizeWheel(event);
        callback && callback(event, normalized);
      }, {
        passive: true
      });
    }
  };

  var Mousewheel = {
    beforeMount(el, binding) {
      mousewheel(el, binding.value);
    }

  };

  class TableLayout {
    constructor(options) {
      this.observers = [];
      this.table = null;
      this.store = null;
      this.columns = [];
      this.fit = true;
      this.showHeader = true;
      this.height = vue.ref(null);
      this.scrollX = vue.ref(false);
      this.scrollY = vue.ref(false);
      this.bodyWidth = vue.ref(null);
      this.fixedWidth = vue.ref(null);
      this.rightFixedWidth = vue.ref(null);
      this.tableHeight = vue.ref(null);
      this.headerHeight = vue.ref(44);
      this.appendHeight = vue.ref(0);
      this.footerHeight = vue.ref(44);
      this.viewportHeight = vue.ref(null);
      this.bodyHeight = vue.ref(null);
      this.fixedBodyHeight = vue.ref(null);
      this.gutterWidth = getScrollBarWidth();

      for (const name in options) {
        // eslint-disable-next-line no-prototype-builtins
        if (options.hasOwnProperty(name)) {
          if (vue.isRef(this[name])) {
            this[name].value = options[name];
          } else {
            this[name] = options[name];
          }
        }
      }

      if (!this.table) {
        throw new Error('table is required for Table Layout');
      }

      if (!this.store) {
        throw new Error('store is required for Table Layout');
      }
    }

    updateScrollY() {
      const height = this.height.value;
      if (height === null) return false;
      const bodyWrapper = this.table.refs.bodyWrapper;

      if (this.table.vnode.el && bodyWrapper) {
        const body = bodyWrapper.querySelector('.el-table__body');
        const prevScrollY = this.scrollY.value;
        const scrollY = body.offsetHeight > this.bodyHeight.value;
        this.scrollY.value = scrollY;
        return prevScrollY !== scrollY;
      }

      return false;
    }

    setHeight(value, prop = 'height') {
      if (typeof window === undefined) return;
      const el = this.table.vnode.el;
      value = parseHeight(value);
      this.height.value = Number(value);
      if (!el && (value || value === 0)) return vue.nextTick(() => this.setHeight(value, prop));

      if (typeof value === 'number') {
        el.style[prop] = value + 'px';
        this.updateElsHeight();
      } else if (typeof value === 'string') {
        el.style[prop] = value;
        this.updateElsHeight();
      }
    }

    setMaxHeight(value) {
      this.setHeight(value, 'max-height');
    }

    getFlattenColumns() {
      const flattenColumns = [];
      const columns = this.table.store.states.columns.value;
      columns.forEach(column => {
        if (column.isColumnGroup) {
          // eslint-disable-next-line prefer-spread
          flattenColumns.push.apply(flattenColumns, column.columns);
        } else {
          flattenColumns.push(column);
        }
      });
      return flattenColumns;
    }

    updateElsHeight() {
      if (!this.table.$ready) return vue.nextTick(() => this.updateElsHeight());
      const {
        headerWrapper,
        appendWrapper,
        footerWrapper
      } = this.table.refs;
      this.appendHeight.value = appendWrapper ? appendWrapper.offsetHeight : 0;
      if (this.showHeader && !headerWrapper) return; // fix issue (https://github.com/ElemeFE/element/pull/16956)

      const headerTrElm = headerWrapper ? headerWrapper.querySelector('.el-table__header tr') : null;
      const noneHeader = this.headerDisplayNone(headerTrElm);
      const headerHeight = this.headerHeight.value = !this.showHeader ? 0 : headerWrapper.offsetHeight;

      if (this.showHeader && !noneHeader && headerWrapper.offsetWidth > 0 && (this.table.store.states.columns.value || []).length > 0 && headerHeight < 2) {
        return vue.nextTick(() => this.updateElsHeight());
      }

      const tableHeight = this.tableHeight.value = this.table.vnode.el.clientHeight;
      const footerHeight = this.footerHeight.value = footerWrapper ? footerWrapper.offsetHeight : 0;

      if (this.height.value !== null) {
        this.bodyHeight.value = tableHeight - headerHeight - footerHeight + (footerWrapper ? 1 : 0);
      }

      this.fixedBodyHeight.value = this.scrollX.value ? this.bodyHeight.value - this.gutterWidth : this.bodyHeight.value;
      const noData = !(this.store.states.data.value && this.store.states.data.value.length);
      this.viewportHeight.value = this.scrollX.value ? tableHeight - (noData ? 0 : this.gutterWidth) : tableHeight;
      this.updateScrollY();
      this.notifyObservers('scrollable');
    }

    headerDisplayNone(elm) {
      if (!elm) return true;
      let headerChild = elm;

      while (headerChild.tagName !== 'DIV') {
        if (getComputedStyle(headerChild).display === 'none') {
          return true;
        }

        headerChild = headerChild.parentElement;
      }

      return false;
    }

    updateColumnsWidth() {
      if (typeof window === undefined) return;
      const fit = this.fit;
      const bodyWidth = this.table.vnode.el.clientWidth;
      let bodyMinWidth = 0;
      const flattenColumns = this.getFlattenColumns();
      const flexColumns = flattenColumns.filter(column => typeof column.width !== 'number');
      flattenColumns.forEach(column => {
        // Clean those columns whose width changed from flex to unflex
        if (typeof column.width === 'number' && column.realWidth) column.realWidth = null;
      });

      if (flexColumns.length > 0 && fit) {
        flattenColumns.forEach(column => {
          bodyMinWidth += column.width || column.minWidth || 80;
        });
        const scrollYWidth = this.scrollY.value ? this.gutterWidth : 0;

        if (bodyMinWidth <= bodyWidth - scrollYWidth) {
          // DON'T HAVE SCROLL BAR
          this.scrollX.value = false;
          const totalFlexWidth = bodyWidth - scrollYWidth - bodyMinWidth;

          if (flexColumns.length === 1) {
            flexColumns[0].realWidth = (flexColumns[0].minWidth || 80) + totalFlexWidth;
          } else {
            const allColumnsWidth = flexColumns.reduce((prev, column) => prev + (column.minWidth || 80), 0);
            const flexWidthPerPixel = totalFlexWidth / allColumnsWidth;
            let noneFirstWidth = 0;
            flexColumns.forEach((column, index) => {
              if (index === 0) return;
              const flexWidth = Math.floor((column.minWidth || 80) * flexWidthPerPixel);
              noneFirstWidth += flexWidth;
              column.realWidth = (column.minWidth || 80) + flexWidth;
            });
            flexColumns[0].realWidth = (flexColumns[0].minWidth || 80) + totalFlexWidth - noneFirstWidth;
          }
        } else {
          // HAVE HORIZONTAL SCROLL BAR
          this.scrollX.value = true;
          flexColumns.forEach(function (column) {
            column.realWidth = column.minWidth;
          });
        }

        this.bodyWidth.value = Math.max(bodyMinWidth, bodyWidth);
        this.table.state.resizeState.value.width = this.bodyWidth.value;
      } else {
        flattenColumns.forEach(column => {
          if (!column.width && !column.minWidth) {
            column.realWidth = 80;
          } else {
            column.realWidth = column.width || column.minWidth;
          }

          bodyMinWidth += column.realWidth;
        });
        this.scrollX.value = bodyMinWidth > bodyWidth;
        this.bodyWidth.value = bodyMinWidth;
      }

      const fixedColumns = this.store.states.fixedColumns.value;

      if (fixedColumns.length > 0) {
        let fixedWidth = 0;
        fixedColumns.forEach(function (column) {
          fixedWidth += column.realWidth || column.width;
        });
        this.fixedWidth.value = fixedWidth;
      }

      const rightFixedColumns = this.store.states.rightFixedColumns.value;

      if (rightFixedColumns.length > 0) {
        let rightFixedWidth = 0;
        rightFixedColumns.forEach(function (column) {
          rightFixedWidth += column.realWidth || column.width;
        });
        this.rightFixedWidth.value = rightFixedWidth;
      }

      this.notifyObservers('columns');
      this.updateElsHeight();
    }

    addObserver(observer) {
      this.observers.push(observer);
    }

    removeObserver(observer) {
      const index = this.observers.indexOf(observer);

      if (index !== -1) {
        this.observers.splice(index, 1);
      }
    }

    notifyObservers(event) {
      const observers = this.observers;
      observers.forEach(observer => {
        var _observer$state, _observer$state2;

        switch (event) {
          case 'columns':
            (_observer$state = observer.state) === null || _observer$state === void 0 ? void 0 : _observer$state.onColumnsChange(this);
            break;

          case 'scrollable':
            (_observer$state2 = observer.state) === null || _observer$state2 === void 0 ? void 0 : _observer$state2.onScrollableChange(this);
            break;

          default:
            throw new Error(`Table Layout don't have event ${event}.`);
        }
      });
    }

  }

  var dropdowns = [];
  !(typeof window === 'undefined') && document.addEventListener('click', function (event) {
    dropdowns.forEach(function (dropdown) {
      var target = event.target;
      if (!dropdown || !dropdown.$el) return;

      if (target === dropdown.$el || dropdown.$el.contains(target)) {
        return;
      }

      dropdown.handleOutsideClick && dropdown.handleOutsideClick(event);
    });
  });
  var Dropdown = {
    open(instance) {
      if (instance) {
        dropdowns.push(instance);
      }
    },

    close(instance) {
      var index = dropdowns.indexOf(instance);

      if (index !== -1) {
        dropdowns.splice(instance, 1);
      }
    }

  };

  var script$Q = {
    name: 'ElTableFilterPanel',
    mixins: [Popper, Locale],
    directives: {
      Clickoutside
    },
    components: {
      ElCheckbox: script$1o,
      ElCheckboxGroup: script$1m,
      ElScrollbar
    },
    props: {
      placement: {
        type: String,
        default: 'bottom-end'
      }
    },
    methods: {
      isActive(filter) {
        return filter.value === this.filterValue;
      },

      handleOutsideClick() {
        setTimeout(() => {
          this.showPopper = false;
        }, 16);
      },

      handleConfirm() {
        this.confirmFilter(this.filteredValue);
        this.handleOutsideClick();
      },

      handleReset() {
        this.filteredValue = [];
        this.confirmFilter(this.filteredValue);
        this.handleOutsideClick();
      },

      handleSelect(filterValue) {
        this.filterValue = filterValue;

        if (typeof filterValue !== 'undefined' && filterValue !== null) {
          this.confirmFilter(this.filteredValue);
        } else {
          this.confirmFilter([]);
        }

        this.handleOutsideClick();
      },

      confirmFilter(filteredValue) {
        this.table.store.commit('filterChange', {
          column: this.column,
          values: filteredValue
        });
        this.table.store.updateAllSelected();
      }

    },

    data() {
      return {
        table: null,
        cell: null,
        column: null
      };
    },

    computed: {
      filters() {
        return this.column && this.column.filters;
      },

      filterValue: {
        get() {
          return (this.column.filteredValue || [])[0];
        },

        set(value) {
          if (this.filteredValue) {
            if (typeof value !== 'undefined' && value !== null) {
              this.filteredValue.splice(0, 1, value);
            } else {
              this.filteredValue.splice(0, 1);
            }
          }
        }

      },
      filteredValue: {
        get() {
          if (this.column) {
            return this.column.filteredValue || [];
          }

          return [];
        },

        set(value) {
          if (this.column) {
            this.column.filteredValue = value;
          }
        }

      },

      multiple() {
        if (this.column) {
          return this.column.filterMultiple;
        }

        return true;
      }

    },

    mounted() {
      this.popperElm = this.$el;
      this.referenceElm = this.cell;
      this.table.bodyWrapper.addEventListener('scroll', () => {
        this.updatePopper();
      });
      this.$watch('showPopper', value => {
        if (this.column) this.column.filterOpened = value;

        if (value) {
          Dropdown.open(this);
        } else {
          Dropdown.close(this);
        }
      });
    },

    watch: {
      showPopper(val) {
        if (val === true && parseInt(this.popperJS._popper.style.zIndex, 10) < PopupManager.zIndex) {
          this.popperJS._popper.style.zIndex = PopupManager.nextZIndex();
        }
      }

    }
  };

  const _hoisted_1$z = {
    key: 0,
    class: "el-table-filter"
  };
  const _hoisted_2$l = {
    class: "el-table-filter__content"
  };
  const _hoisted_3$h = {
    class: "el-table-filter__bottom"
  };
  const _hoisted_4$b = {
    key: 1,
    class: "el-table-filter"
  };
  const _hoisted_5$7 = {
    class: "el-table-filter__list"
  };
  function render$J(_ctx, _cache, $props, $setup, $data, $options) {
    const _component_el_checkbox = vue.resolveComponent("el-checkbox");

    const _component_el_checkbox_group = vue.resolveComponent("el-checkbox-group");

    const _component_el_scrollbar = vue.resolveComponent("el-scrollbar");

    const _directive_clickoutside = vue.resolveDirective("clickoutside");

    return vue.openBlock(), vue.createBlock(vue.Transition, {
      name: "el-zoom-in-top"
    }, {
      default: vue.withCtx(() => [$options.multiple ? vue.withDirectives((vue.openBlock(), vue.createBlock("div", _hoisted_1$z, [vue.createVNode("div", _hoisted_2$l, [vue.createVNode(_component_el_scrollbar, {
        "wrap-class": "el-table-filter__wrap"
      }, {
        default: vue.withCtx(() => [vue.createVNode(_component_el_checkbox_group, {
          class: "el-table-filter__checkbox-group",
          modelValue: $options.filteredValue,
          "onUpdate:modelValue": _cache[1] || (_cache[1] = $event => $options.filteredValue = $event)
        }, {
          default: vue.withCtx(() => [(vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList($options.filters, filter => {
            return vue.openBlock(), vue.createBlock(_component_el_checkbox, {
              key: filter.value,
              label: filter.value
            }, {
              default: vue.withCtx(() => [vue.createTextVNode(vue.toDisplayString(filter.text), 1
              /* TEXT */
              )]),
              _: 2
              /* DYNAMIC */

            }, 1032
            /* PROPS, DYNAMIC_SLOTS */
            , ["label"]);
          }), 128
          /* KEYED_FRAGMENT */
          ))]),
          _: 1
          /* STABLE */

        }, 8
        /* PROPS */
        , ["modelValue"])]),
        _: 1
        /* STABLE */

      })]), vue.createVNode("div", _hoisted_3$h, [vue.createVNode("button", {
        onClick: _cache[2] || (_cache[2] = (...args) => $options.handleConfirm && $options.handleConfirm(...args)),
        class: {
          'is-disabled': $options.filteredValue.length === 0
        },
        disabled: $options.filteredValue.length === 0
      }, vue.toDisplayString(_ctx.t('el.table.confirmFilter')), 11
      /* TEXT, CLASS, PROPS */
      , ["disabled"]), vue.createVNode("button", {
        onClick: _cache[3] || (_cache[3] = (...args) => $options.handleReset && $options.handleReset(...args))
      }, vue.toDisplayString(_ctx.t('el.table.resetFilter')), 1
      /* TEXT */
      )])], 512
      /* NEED_PATCH */
      )), [[_directive_clickoutside, $options.handleOutsideClick], [vue.vShow, _ctx.showPopper]]) : vue.withDirectives((vue.openBlock(), vue.createBlock("div", _hoisted_4$b, [vue.createVNode("ul", _hoisted_5$7, [vue.createVNode("li", {
        class: ["el-table-filter__list-item", {
          'is-active': $options.filterValue === undefined || $options.filterValue === null
        }],
        onClick: _cache[4] || (_cache[4] = $event => $options.handleSelect(null))
      }, vue.toDisplayString(_ctx.t('el.table.clearFilter')), 3
      /* TEXT, CLASS */
      ), (vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList($options.filters, filter => {
        return vue.openBlock(), vue.createBlock("li", {
          class: ["el-table-filter__list-item", {
            'is-active': $options.isActive(filter)
          }],
          label: filter.value,
          key: filter.value,
          onClick: $event => $options.handleSelect(filter.value)
        }, vue.toDisplayString(filter.text), 11
        /* TEXT, CLASS, PROPS */
        , ["label", "onClick"]);
      }), 128
      /* KEYED_FRAGMENT */
      ))])], 512
      /* NEED_PATCH */
      )), [[_directive_clickoutside, $options.handleOutsideClick], [vue.vShow, _ctx.showPopper]])]),
      _: 1
      /* STABLE */

    });
  }

  script$Q.render = render$J;
  script$Q.__file = "packages/table/src/filter-panel.vue";

  function useLayoutObserver(root) {
    const instance = vue.getCurrentInstance();
    vue.onBeforeMount(() => {
      tableLayout.value.addObserver(instance);
    });
    vue.onMounted(() => {
      onColumnsChange(tableLayout.value);
      onScrollableChange(tableLayout.value);
    });
    vue.onUpdated(() => {
      onColumnsChange(tableLayout.value);
      onScrollableChange(tableLayout.value);
    });
    vue.onUnmounted(() => {
      tableLayout.value.removeObserver(instance);
    });
    const tableLayout = vue.computed(() => {
      const layout = root.layout;

      if (!layout) {
        throw new Error('Can not find table layout.');
      }

      return layout;
    });

    const onColumnsChange = layout => {
      vue.nextTick(() => {
        var _root$vnode$el;

        const cols = (_root$vnode$el = root.vnode.el) === null || _root$vnode$el === void 0 ? void 0 : _root$vnode$el.querySelectorAll('colgroup > col');
        if (!cols || !cols.length) return;
        const flattenColumns = layout.getFlattenColumns();
        const columnsMap = {};
        flattenColumns.forEach(column => {
          columnsMap[column.id] = column;
        });

        for (let i = 0, j = cols.length; i < j; i++) {
          const col = cols[i];
          const name = col.getAttribute('name');
          const column = columnsMap[name];

          if (column) {
            col.setAttribute('width', column.realWidth || column.width);
          }
        }
      });
    };

    const onScrollableChange = layout => {
      vue.nextTick(() => {
        var _root$vnode$el2;

        const cols = (_root$vnode$el2 = root.vnode.el) === null || _root$vnode$el2 === void 0 ? void 0 : _root$vnode$el2.querySelectorAll('colgroup > col[name=gutter]');

        for (let i = 0, j = cols.length; i < j; i++) {
          const col = cols[i];
          col.setAttribute('width', layout.scrollY.value ? layout.gutterWidth : '0');
        }

        const ths = root.vnode.el.querySelectorAll('th.gutter');

        for (let i = 0, j = ths.length; i < j; i++) {
          const th = ths[i];
          th.style.width = layout.scrollY.value ? layout.gutterWidth + 'px' : '0';
          th.style.display = layout.scrollY.value ? '' : 'none';
        }
      });
    };

    return {
      tableLayout: tableLayout.value,
      onColumnsChange,
      onScrollableChange
    };
  }

  function useEvent(props, emit) {
    const instance = vue.getCurrentInstance();
    const parent = instance.parent;

    const handleFilterClick = event => {
      event.stopPropagation();
      return;
    };

    const handleHeaderClick = (event, column) => {
      if (!column.filters && column.sortable) {
        handleSortClick(event, column, false);
      } else if (column.filterable && !column.sortable) {
        handleFilterClick(event);
      }

      parent.emit('header-click', column, event);
    };

    const handleHeaderContextMenu = (event, column) => {
      parent.emit('header-contextmenu', column, event);
    };

    const draggingColumn = vue.ref(null);
    const dragging = vue.ref(false);
    const dragState = vue.ref({});

    const handleMouseDown = (event, column) => {
      if (typeof window === undefined) return;
      if (column.children && column.children.length > 0) return;
      /* istanbul ignore if */

      if (draggingColumn.value && props.border) {
        dragging.value = true;
        const table = parent;
        emit('set-drag-visible', true);
        const tableEl = table.vnode.el;
        const tableLeft = tableEl.getBoundingClientRect().left;
        const columnEl = instance.vnode.el.querySelector(`th.${column.id}`);
        const columnRect = columnEl.getBoundingClientRect();
        const minLeft = columnRect.left - tableLeft + 30;
        addClass(columnEl, 'noclick');
        dragState.value = {
          startMouseLeft: event.clientX,
          startLeft: columnRect.right - tableLeft,
          startColumnLeft: columnRect.left - tableLeft,
          tableLeft
        };
        const resizeProxy = table.refs.resizeProxy;
        resizeProxy.style.left = dragState.value.startLeft + 'px';

        document.onselectstart = function () {
          return false;
        };

        document.ondragstart = function () {
          return false;
        };

        const handleMouseMove = event => {
          const deltaLeft = event.clientX - dragState.value.startMouseLeft;
          const proxyLeft = dragState.value.startLeft + deltaLeft;
          resizeProxy.style.left = Math.max(minLeft, proxyLeft) + 'px';
        };

        const handleMouseUp = () => {
          if (dragging.value) {
            const {
              startColumnLeft,
              startLeft
            } = dragState.value;
            const finalLeft = parseInt(resizeProxy.style.left, 10);
            const columnWidth = finalLeft - startColumnLeft;
            column.width = column.realWidth = columnWidth;
            table.emit('header-dragend', column.width, startLeft - startColumnLeft, column, event);
            props.store.scheduleLayout(false, true);
            document.body.style.cursor = '';
            dragging.value = false;
            draggingColumn.value = null;
            dragState.value = {};
            emit('set-drag-visible', false);
          }

          document.removeEventListener('mousemove', handleMouseMove);
          document.removeEventListener('mouseup', handleMouseUp);
          document.onselectstart = null;
          document.ondragstart = null;
          setTimeout(function () {
            removeClass(columnEl, 'noclick');
          }, 0);
        };

        document.addEventListener('mousemove', handleMouseMove);
        document.addEventListener('mouseup', handleMouseUp);
      }
    };

    const handleMouseMove = (event, column) => {
      if (column.children && column.children.length > 0) return;
      let target = event.target;

      while (target && target.tagName !== 'TH') {
        target = target.parentNode;
      }

      if (!column || !column.resizable) return;

      if (!dragging.value && props.border) {
        const rect = target.getBoundingClientRect();
        const bodyStyle = document.body.style;

        if (rect.width > 12 && rect.right - event.pageX < 8) {
          bodyStyle.cursor = 'col-resize';

          if (hasClass(target, 'is-sortable')) {
            target.style.cursor = 'col-resize';
          }

          draggingColumn.value = column;
        } else if (!dragging.value) {
          bodyStyle.cursor = '';

          if (hasClass(target, 'is-sortable')) {
            target.style.cursor = 'pointer';
          }

          draggingColumn.value = null;
        }
      }
    };

    const handleMouseOut = () => {
      if (typeof window === undefined) return;
      document.body.style.cursor = '';
    };

    const toggleOrder = ({
      order,
      sortOrders
    }) => {
      if (order === '') return sortOrders[0];
      const index = sortOrders.indexOf(order || null);
      return sortOrders[index > sortOrders.length - 2 ? 0 : index + 1];
    };

    const handleSortClick = (event, column, givenOrder) => {
      event.stopPropagation();
      const order = column.order === givenOrder ? null : givenOrder || toggleOrder(column);
      let target = event.target;

      while (target && target.tagName !== 'TH') {
        target = target.parentNode;
      }

      if (target && target.tagName === 'TH') {
        if (hasClass(target, 'noclick')) {
          removeClass(target, 'noclick');
          return;
        }
      }

      if (!column.sortable) return;
      const states = props.store.states;
      let sortProp = states.sortProp.value;
      let sortOrder;
      const sortingColumn = states.sortingColumn.value;

      if (sortingColumn !== column || sortingColumn === column && sortingColumn.order === null) {
        if (sortingColumn) {
          sortingColumn.order = null;
        }

        states.sortingColumn.value = column;
        sortProp = column.property;
      }

      if (!order) {
        sortOrder = column.order = null;
      } else {
        sortOrder = column.order = order;
      }

      states.sortProp.value = sortProp;
      states.sortOrder.value = sortOrder;
      parent.store.commit('changeSortCondition');
    };

    return {
      handleHeaderClick,
      handleHeaderContextMenu,
      handleMouseDown,
      handleMouseMove,
      handleMouseOut,
      handleSortClick,
      handleFilterClick
    };
  }

  function useStyle$3(props) {
    const instance = vue.getCurrentInstance();
    const parent = instance.parent;
    const storeData = parent.store.states;

    const isCellHidden = (index, columns) => {
      let start = 0;

      for (let i = 0; i < index; i++) {
        start += columns[i].colSpan;
      }

      const after = start + columns[index].colSpan - 1;

      if (props.fixed === 'left') {
        return after >= storeData.fixedLeafColumnsLength.value;
      } else if (props.fixed === 'right') {
        return start < storeData.columns.value.length - storeData.rightFixedLeafColumnsLength.value;
      } else {
        return after < storeData.fixedLeafColumnsLength.value || start >= storeData.columns.value.length - storeData.rightFixedLeafColumnsLength.value;
      }
    };

    const getHeaderRowStyle = rowIndex => {
      const headerRowStyle = parent.props.headerRowStyle;

      if (typeof headerRowStyle === 'function') {
        return headerRowStyle.call(null, {
          rowIndex
        });
      }

      return headerRowStyle;
    };

    const getHeaderRowClass = rowIndex => {
      const classes = [];
      const headerRowClassName = parent.props.headerRowClassName;

      if (typeof headerRowClassName === 'string') {
        classes.push(headerRowClassName);
      } else if (typeof headerRowClassName === 'function') {
        classes.push(headerRowClassName.call(null, {
          rowIndex
        }));
      }

      return classes.join(' ');
    };

    const getHeaderCellStyle = (rowIndex, columnIndex, row, column) => {
      const headerCellStyle = parent.props.headerCellStyle;

      if (typeof headerCellStyle === 'function') {
        return headerCellStyle.call(null, {
          rowIndex,
          columnIndex,
          row,
          column
        });
      }

      return headerCellStyle;
    };

    const getHeaderCellClass = (rowIndex, columnIndex, row, column) => {
      const classes = [column.id, column.order, column.headerAlign, column.className, column.labelClassName];

      if (rowIndex === 0 && isCellHidden(columnIndex, row)) {
        classes.push('is-hidden');
      }

      if (!column.children) {
        classes.push('is-leaf');
      }

      if (column.sortable) {
        classes.push('is-sortable');
      }

      const headerCellClassName = parent.props.headerCellClassName;

      if (typeof headerCellClassName === 'string') {
        classes.push(headerCellClassName);
      } else if (typeof headerCellClassName === 'function') {
        classes.push(headerCellClassName.call(null, {
          rowIndex,
          columnIndex,
          row,
          column
        }));
      }

      return classes.join(' ');
    };

    return {
      getHeaderRowStyle,
      getHeaderRowClass,
      getHeaderCellStyle,
      getHeaderCellClass
    };
  }

  const getAllColumns = columns => {
    const result = [];
    columns.forEach(column => {
      if (column.children) {
        result.push(column); // eslint-disable-next-line prefer-spread

        result.push.apply(result, getAllColumns(column.children));
      } else {
        result.push(column);
      }
    });
    return result;
  };

  const convertToRows = originColumns => {
    let maxLevel = 1;

    const traverse = (column, parent) => {
      if (parent) {
        column.level = parent.level + 1;

        if (maxLevel < column.level) {
          maxLevel = column.level;
        }
      }

      if (column.children) {
        let colSpan = 0;
        column.children.forEach(subColumn => {
          traverse(subColumn, column);
          colSpan += subColumn.colSpan;
        });
        column.colSpan = colSpan;
      } else {
        column.colSpan = 1;
      }
    };

    originColumns.forEach(column => {
      column.level = 1;
      traverse(column, undefined);
    });
    const rows = [];

    for (let i = 0; i < maxLevel; i++) {
      rows.push([]);
    }

    const allColumns = getAllColumns(originColumns);
    allColumns.forEach(column => {
      if (!column.children) {
        column.rowSpan = maxLevel - column.level + 1;
      } else {
        column.rowSpan = 1;
      }

      rows[column.level - 1].push(column);
    });
    return rows;
  };

  function useUtils$1(props) {
    const instance = vue.getCurrentInstance();
    const parent = instance.parent;
    const columnRows = vue.computed(() => {
      return convertToRows(props.store.states.originColumns.value);
    });
    const isGroup = vue.computed(() => {
      const result = columnRows.value.length > 1;
      if (result) parent.state.isGroup.value = true;
      return result;
    });

    const toggleAllSelection = event => {
      event.stopPropagation();
      parent.store.commit('toggleAllSelection');
    };

    return {
      isGroup,
      toggleAllSelection,
      columnRows
    };
  }

  function hGutter() {
    return vue.h('col', {
      name: 'gutter'
    });
  }
  function hColgroup(columns, hasGutter) {
    return vue.h('colgroup', {}, [...columns.map(column => vue.h('col', {
      name: column.id,
      key: column.id
    })), hasGutter && hGutter()]);
  }

  var TableHeader = {
    name: 'ElTableHeader',
    components: {
      ElCheckbox: script$1o
    },
    props: {
      fixed: {
        type: String,
        default: ''
      },
      store: {
        required: true,
        type: Object
      },
      border: Boolean,
      defaultSort: {
        type: Object,

        default() {
          return {
            prop: '',
            order: ''
          };
        }

      }
    },

    setup(props, {
      emit
    }) {
      const instance = vue.getCurrentInstance();
      const parent = instance.parent;
      const storeData = parent.store.states;
      const filterPanels = vue.ref({});
      const {
        tableLayout,
        onColumnsChange,
        onScrollableChange
      } = useLayoutObserver(parent);
      const hasGutter = vue.computed(() => {
        return !props.fixed && tableLayout.gutterWidth;
      });
      vue.onMounted(() => {
        vue.nextTick(() => {
          const {
            prop,
            order
          } = props.defaultSort;
          const init = true;
          parent.store.commit('sort', {
            prop,
            order,
            init
          });
        });
      });
      const {
        handleHeaderClick,
        handleHeaderContextMenu,
        handleMouseDown,
        handleMouseMove,
        handleMouseOut,
        handleSortClick,
        handleFilterClick
      } = useEvent(props, emit);
      const {
        getHeaderRowStyle,
        getHeaderRowClass,
        getHeaderCellStyle,
        getHeaderCellClass
      } = useStyle$3(props);
      const {
        isGroup,
        toggleAllSelection,
        columnRows
      } = useUtils$1(props);
      instance.state = {
        onColumnsChange,
        onScrollableChange
      }; // eslint-disable-next-line

      instance.filterPanels = filterPanels;
      return {
        columns: storeData.columns,
        filterPanels,
        hasGutter,
        onColumnsChange,
        onScrollableChange,
        columnRows,
        getHeaderRowClass,
        getHeaderRowStyle,
        getHeaderCellClass,
        getHeaderCellStyle,
        handleHeaderClick,
        handleHeaderContextMenu,
        handleMouseDown,
        handleMouseMove,
        handleMouseOut,
        handleSortClick,
        handleFilterClick,
        isGroup,
        toggleAllSelection
      };
    },

    render() {
      return vue.h('table', {
        border: '0',
        cellpadding: '0',
        cellspacing: '0',
        class: 'el-table__header'
      }, [hColgroup(this.columns, this.hasGutter), vue.h('thead', {
        class: {
          'is-group': this.isGroup,
          'has-gutter': this.hasGutter
        }
      }, this.columnRows.map((subColumns, rowIndex) => vue.h('tr', {
        class: this.getHeaderRowClass(rowIndex),
        key: rowIndex,
        style: this.getHeaderRowStyle(rowIndex)
      }, subColumns.map((column, cellIndex) => vue.h('th', {
        class: this.getHeaderCellClass(rowIndex, cellIndex, subColumns, column),
        colspan: column.colSpan,
        key: `${column.id}-thead`,
        rowSpan: column.rowSpan,
        style: this.getHeaderCellStyle(rowIndex, cellIndex, subColumns, column),
        onClick: $event => this.handleHeaderClick($event, column),
        onContextmenu: $event => this.handleHeaderContextMenu($event, column),
        onMousedown: $event => this.handleMouseDown($event, column),
        onMouseMove: $event => this.handleMouseMove($event, column),
        onMouseout: this.handleMouseOut
      }, [vue.h('div', {
        class: ['cell', column.filteredValue && column.filteredValue.length > 0 ? 'highlight' : '', column.labelClassName]
      }, [column.renderHeader ? column.renderHeader({
        column,
        index_: cellIndex,
        store: this.store,
        _self: this.$parent
      }) : column.label, column.sortable && vue.h('span', {
        onClick: $event => this.handleSortClick($event, column),
        class: 'caret-wrapper'
      }, [vue.h('i', {
        onClick: $event => this.handleSortClick($event, column, 'ascending'),
        class: 'sort-caret ascending'
      }), vue.h('i', {
        onClick: $event => this.handleSortClick($event, column, 'descending'),
        class: 'sort-caret descending'
      })]), column.filterable && vue.h(script$Q, {
        table: this.$parent,
        store: this.$parent.store,
        placement: column.filterPlacement || 'bottom-start',
        column: column,
        upDataColumn: (key, value) => {
          column[key] = value;
        }
      })])])))))]);
    }

  };

  function useEvents(props) {
    const instance = vue.getCurrentInstance();
    const parent = instance.parent;
    const tooltipVisible = vue.ref(false);
    const tooltipContent = vue.ref('');
    const tooltipTrigger = vue.ref(vue.h('div'));

    const handleEvent = (event, row, name) => {
      const table = parent;
      const cell = getCell(event);
      let column;

      if (cell) {
        column = getColumnByCell({
          columns: props.store.states.columns.value
        }, cell);

        if (column) {
          table.emit(`cell-${name}`, row, column, cell, event);
        }
      }

      table.emit(`row-${name}`, row, column, event);
    };

    const handleDoubleClick = (event, row) => {
      handleEvent(event, row, 'dblclick');
    };

    const handleClick = (event, row) => {
      props.store.commit('setCurrentRow', row);
      handleEvent(event, row, 'click');
    };

    const handleContextMenu = (event, row) => {
      handleEvent(event, row, 'contextmenu');
    };

    const handleMouseEnter = debounce(function (index) {
      props.store.commit('setHoverRow', index);
    }, 30);
    const handleMouseLeave = debounce(function () {
      props.store.commit('setHoverRow', null);
    }, 30);

    const handleCellMouseEnter = (event, row) => {
      const table = parent;
      const cell = getCell(event);

      if (cell) {
        const column = getColumnByCell({
          columns: props.store.states.columns.value
        }, cell);
        const hoverState = table.hoverState = {
          cell,
          column,
          row
        };
        table.emit('cell-mouse-enter', hoverState.row, hoverState.column, hoverState.cell, event);
      } // 判断是否text-overflow, 如果是就显示tooltip


      const cellChild = event.target.querySelector('.cell');

      if (!(hasClass(cellChild, 'el-tooltip') && cellChild.childNodes.length)) {
        return;
      } // use range width instead of scrollWidth to determine whether the text is overflowing
      // to address a potential FireFox bug: https://bugzilla.mozilla.org/show_bug.cgi?id=1074543#c3


      const range = document.createRange();
      range.setStart(cellChild, 0);
      range.setEnd(cellChild, cellChild.childNodes.length);
      const rangeWidth = range.getBoundingClientRect().width;
      const padding = (parseInt(getStyle(cellChild, 'paddingLeft'), 10) || 0) + (parseInt(getStyle(cellChild, 'paddingRight'), 10) || 0);

      if (rangeWidth + padding > cellChild.offsetWidth || cellChild.scrollWidth > cellChild.offsetWidth) {
        // TODO 会引起整个 Table 的重新渲染，需要优化
        tooltipContent.value = cell.innerText || cell.textContent;
        tooltipVisible.value = true; // TODO 动态绑定触发的元素会导致开发模式下产生警告

        tooltipTrigger.value = cell;
      }
    };

    const handleCellMouseLeave = event => {
      tooltipVisible.value = false;
      const cell = getCell(event);
      if (!cell) return;
      const oldHoverState = parent.hoverState;
      parent.emit('cell-mouse-leave', oldHoverState === null || oldHoverState === void 0 ? void 0 : oldHoverState.row, oldHoverState === null || oldHoverState === void 0 ? void 0 : oldHoverState.column, oldHoverState === null || oldHoverState === void 0 ? void 0 : oldHoverState.cell, event);
    };

    return {
      handleDoubleClick,
      handleClick,
      handleContextMenu,
      handleMouseEnter,
      handleMouseLeave,
      handleCellMouseEnter,
      handleCellMouseLeave,
      tooltipVisible,
      tooltipContent,
      tooltipTrigger
    };
  }

  function useStyles(props) {
    const instance = vue.getCurrentInstance();
    const parent = instance.parent;

    const isColumnHidden = index => {
      if (props.fixed === 'left') {
        return index >= props.store.states.fixedLeafColumnsLength.value;
      } else if (props.fixed === 'right') {
        return index < props.store.states.columns.value.length - props.store.states.rightFixedLeafColumnsLength.value;
      } else {
        return index < props.store.states.fixedLeafColumnsLength.value || index >= props.store.states.columns.value.length - props.store.states.rightFixedLeafColumnsLength.value;
      }
    };

    const getRowStyle = (row, rowIndex) => {
      const rowStyle = parent.props.rowStyle;

      if (typeof rowStyle === 'function') {
        return rowStyle.call(null, {
          row,
          rowIndex
        });
      }

      return rowStyle || null;
    };

    const getRowClass = (row, rowIndex) => {
      const classes = ['el-table__row'];

      if (parent.props.highlightCurrentRow && row === props.store.states.currentRow.value) {
        classes.push('current-row');
      }

      if (props.stripe && rowIndex % 2 === 1) {
        classes.push('el-table__row--striped');
      }

      const rowClassName = parent.props.rowClassName;

      if (typeof rowClassName === 'string') {
        classes.push(rowClassName);
      } else if (typeof rowClassName === 'function') {
        classes.push(rowClassName.call(null, {
          row,
          rowIndex
        }));
      }

      if (props.store.states.expandRows.value.indexOf(row) > -1) {
        classes.push('expanded');
      }

      return classes;
    };

    const getCellStyle = (rowIndex, columnIndex, row, column) => {
      const cellStyle = parent.props.cellStyle;

      if (typeof cellStyle === 'function') {
        return cellStyle.call(null, {
          rowIndex,
          columnIndex,
          row,
          column
        });
      }

      return cellStyle;
    };

    const getCellClass = (rowIndex, columnIndex, row, column) => {
      const classes = [column.id, column.align, column.className];

      if (isColumnHidden(columnIndex)) {
        classes.push('is-hidden');
      }

      const cellClassName = parent.props.cellClassName;

      if (typeof cellClassName === 'string') {
        classes.push(cellClassName);
      } else if (typeof cellClassName === 'function') {
        classes.push(cellClassName.call(null, {
          rowIndex,
          columnIndex,
          row,
          column
        }));
      }

      return classes.join(' ');
    };

    const getSpan = (row, column, rowIndex, columnIndex) => {
      let rowspan = 1;
      let colspan = 1;
      const fn = parent.props.spanMethod;

      if (typeof fn === 'function') {
        const result = fn({
          row,
          column,
          rowIndex,
          columnIndex
        });

        if (Array.isArray(result)) {
          rowspan = result[0];
          colspan = result[1];
        } else if (typeof result === 'object') {
          rowspan = result.rowspan;
          colspan = result.colspan;
        }
      }

      return {
        rowspan,
        colspan
      };
    };

    const getColspanRealWidth = (columns, colspan, index) => {
      if (colspan < 1) {
        return columns[index].realWidth;
      }

      const widthArr = columns.map(({
        realWidth
      }) => realWidth).slice(index, index + colspan);
      return widthArr.reduce((acc, width) => acc + width, -1);
    };

    return {
      getRowStyle,
      getRowClass,
      getCellStyle,
      getCellClass,
      getSpan,
      getColspanRealWidth,
      isColumnHidden
    };
  }

  function useRender$1(props) {
    const instance = vue.getCurrentInstance();
    const parent = instance.parent;
    const {
      handleDoubleClick,
      handleClick,
      handleContextMenu,
      handleMouseEnter,
      handleMouseLeave,
      handleCellMouseEnter,
      handleCellMouseLeave,
      tooltipVisible,
      tooltipContent,
      tooltipTrigger
    } = useEvents(props);
    const {
      getRowStyle,
      getRowClass,
      getCellStyle,
      getCellClass,
      getSpan,
      getColspanRealWidth
    } = useStyles(props);
    const firstDefaultColumnIndex = vue.computed(() => {
      return arrayFindIndex(props.store.states.columns.value, ({
        type
      }) => type === 'default');
    });

    const getKeyOfRow = (row, index) => {
      const rowKey = parent.props.rowKey;

      if (rowKey) {
        return getRowIdentity(row, rowKey);
      }

      return index;
    };

    const rowRender = (row, index_, treeRowData) => {
      const {
        indent,
        columns
      } = props.store.states;
      const rowClasses = getRowClass(row, index_);
      let display = true;

      if (treeRowData) {
        rowClasses.push('el-table__row--level-' + treeRowData.level);
        display = treeRowData.display;
      }

      const displayStyle = display ? null : {
        display: 'none'
      };
      return vue.h('tr', {
        style: [displayStyle, getRowStyle(row, index_)],
        class: rowClasses,
        key: getKeyOfRow(row, index_),
        onDblclick: $event => handleDoubleClick($event, row),
        onClick: $event => handleClick($event, row),
        onContextmenu: $event => handleContextMenu($event, row),
        onMouseenter: () => handleMouseEnter(index_),
        onMouseleave: handleMouseLeave
      }, columns.value.map((column, cellIndex) => {
        const {
          rowspan,
          colspan
        } = getSpan(row, column, index_, cellIndex);

        if (!rowspan || !colspan) {
          return null;
        }

        const columnData = { ...column
        };
        columnData.realWidth = getColspanRealWidth(columns.value, colspan, cellIndex); // debugger;

        const data = {
          store: props.store,
          _self: props.context || parent,
          column: columnData,
          row,
          index_
        };

        if (cellIndex === firstDefaultColumnIndex.value && treeRowData) {
          data.treeNode = {
            indent: treeRowData.level * indent.value,
            level: treeRowData.level
          };

          if (typeof treeRowData.expanded === 'boolean') {
            data.treeNode.expanded = treeRowData.expanded; // 表明是懒加载

            if ('loading' in treeRowData) {
              data.treeNode.loading = treeRowData.loading;
            }

            if ('noLazyChildren' in treeRowData) {
              data.treeNode.noLazyChildren = treeRowData.noLazyChildren;
            }
          }
        }

        return vue.h('td', {
          style: getCellStyle(index_, cellIndex, row, column),
          class: getCellClass(index_, cellIndex, row, column),
          rowspan,
          colspan,
          onMouseenter: $event => handleCellMouseEnter($event, row),
          onMouseleave: handleCellMouseLeave
        }, [column.renderCell(data)]);
      }));
    };

    const wrappedRowRender = (row, index_) => {
      const store = props.store;
      const {
        isRowExpanded,
        assertRowKey
      } = store;
      const {
        treeData,
        lazyTreeNodeMap,
        childrenColumnName,
        rowKey
      } = store.states;
      const hasExpandColumn = store.states.columns.value.some(({
        type
      }) => type === 'expand');

      if (hasExpandColumn && isRowExpanded(row)) {
        const renderExpanded = parent.renderExpanded;
        const tr = rowRender(row, index_, undefined);

        if (!renderExpanded) {
          console.error('[Element Error]renderExpanded is required.');
          return tr;
        } // 使用二维数组，避免修改 index_


        return [[tr, vue.h('tr', {
          key: 'expanded-row__' + tr.key
        }, [vue.h('td', {
          colspan: store.states.columns.value.length,
          class: 'el-table__expanded-cell'
        }, [renderExpanded({
          row,
          index_,
          store
        })])])]];
      } else if (Object.keys(treeData.value).length) {
        assertRowKey(); // TreeTable 时，rowKey 必须由用户设定，不使用 getKeyOfRow 计算
        // 在调用 rowRender 函数时，仍然会计算 rowKey，不太好的操作

        const key = getRowIdentity(row, rowKey.value);
        let cur = treeData.value[key];
        let treeRowData = null;

        if (cur) {
          treeRowData = {
            expanded: cur.expanded,
            level: cur.level,
            display: true
          };

          if (typeof cur.lazy === 'boolean') {
            if (typeof cur.loaded === 'boolean' && cur.loaded) {
              treeRowData.noLazyChildren = !(cur.children && cur.children.length);
            }

            treeRowData.loading = cur.loading;
          }
        }

        const tmp = [rowRender(row, index_, treeRowData)]; // 渲染嵌套数据

        if (cur) {
          // currentRow 记录的是 index，所以还需主动增加 TreeTable 的 index
          let i = 0;

          const traverse = (children, parent) => {
            if (!(children && children.length && parent)) return;
            children.forEach(node => {
              // 父节点的 display 状态影响子节点的显示状态
              const innerTreeRowData = {
                display: parent.display && parent.expanded,
                level: parent.level + 1,
                expanded: false,
                noLazyChildren: false,
                loading: false
              };
              const childKey = getRowIdentity(node, rowKey.value);

              if (childKey === undefined || childKey === null) {
                throw new Error('for nested data item, row-key is required.');
              }

              cur = { ...treeData.value[childKey]
              }; // 对于当前节点，分成有无子节点两种情况。
              // 如果包含子节点的，设置 expanded 属性。
              // 对于它子节点的 display 属性由它本身的 expanded 与 display 共同决定。

              if (cur) {
                innerTreeRowData.expanded = cur.expanded; // 懒加载的某些节点，level 未知

                cur.level = cur.level || innerTreeRowData.level;
                cur.display = !!(cur.expanded && innerTreeRowData.display);

                if (typeof cur.lazy === 'boolean') {
                  if (typeof cur.loaded === 'boolean' && cur.loaded) {
                    innerTreeRowData.noLazyChildren = !(cur.children && cur.children.length);
                  }

                  innerTreeRowData.loading = cur.loading;
                }
              }

              i++;
              tmp.push(rowRender(node, index_ + i, innerTreeRowData));

              if (cur) {
                const nodes = lazyTreeNodeMap.value[childKey] || node[childrenColumnName.value];
                traverse(nodes, cur);
              }
            });
          }; // 对于 root 节点，display 一定为 true


          cur.display = true;
          const nodes = lazyTreeNodeMap.value[key] || row[childrenColumnName.value];
          traverse(nodes, cur);
        }

        return tmp;
      } else {
        return rowRender(row, index_, undefined);
      }
    };

    return {
      wrappedRowRender,
      tooltipVisible,
      tooltipContent,
      tooltipTrigger
    };
  }

  var TableBody = {
    name: 'ElTableBody',
    props: {
      store: {
        required: true,
        type: Object
      },
      stripe: Boolean,
      context: {
        default: () => ({}),
        type: Object
      },
      rowClassName: [String, Function],
      rowStyle: [Object, Function],
      fixed: {
        type: String,
        default: ''
      },
      highlight: Boolean
    },

    setup(props) {
      const instance = vue.getCurrentInstance();
      const parent = instance.parent;
      const {
        wrappedRowRender,
        tooltipVisible,
        tooltipContent,
        tooltipTrigger
      } = useRender$1(props);
      const {
        onColumnsChange,
        onScrollableChange
      } = useLayoutObserver(parent);
      vue.watch(props.store.states.hoverRow, (newVal, oldVal) => {
        if (!props.store.states.isComplex.value || typeof window === 'undefined') return;
        let raf = window.requestAnimationFrame;

        if (!raf) {
          raf = fn => window.setTimeout(fn, 16);
        }

        raf(() => {
          const rows = instance.vnode.el.querySelectorAll('.el-table__row');
          const oldRow = rows[oldVal];
          const newRow = rows[newVal];

          if (oldRow) {
            removeClass(oldRow, 'hover-row');
          }

          if (newRow) {
            addClass(newRow, 'hover-row');
          }
        });
      });
      return {
        onColumnsChange,
        onScrollableChange,
        wrappedRowRender,
        tooltipVisible,
        tooltipContent,
        tooltipTrigger
      };
    },

    render() {
      const data = this.store.states.data.value || [];
      return vue.h('table', {
        class: 'el-table__body',
        cellspacing: '0',
        cellpadding: '0',
        border: '0'
      }, [hColgroup(this.store.states.columns.value), vue.h('tbody', {}, [data.reduce((acc, row) => {
        return acc.concat(this.wrappedRowRender(row, acc.length));
      }, []), vue.h(ElTooltip, {
        modelValue: this.tooltipVisible,
        content: this.tooltipContent,
        manual: true,
        effect: this.$parent.tooltipEffect,
        placement: 'top'
      }, {
        default: () => this.tooltipTrigger
      })])]);
    }

  };

  function useMapState() {
    const instance = vue.getCurrentInstance();
    const table = instance.parent;
    const store = table.store;
    const leftFixedLeafCount = vue.computed(() => {
      return store.states.fixedLeafColumnsLength.value;
    });
    const rightFixedLeafCount = vue.computed(() => {
      return store.states.rightFixedColumns.value.length;
    });
    const columnsCount = vue.computed(() => {
      return store.states.columns.value.length;
    });
    const leftFixedCount = vue.computed(() => {
      return store.states.fixedColumns.value.length;
    });
    const rightFixedCount = vue.computed(() => {
      return store.states.rightFixedColumns.value.length;
    });
    return {
      leftFixedLeafCount,
      rightFixedLeafCount,
      columnsCount,
      leftFixedCount,
      rightFixedCount,
      columns: store.states.columns
    };
  }

  function useStyle$2(props) {
    const instance = vue.getCurrentInstance();
    const table = instance.parent;
    const store = table.store;
    const {
      leftFixedLeafCount,
      rightFixedLeafCount,
      columnsCount,
      leftFixedCount,
      rightFixedCount,
      columns
    } = useMapState();
    const hasGutter = vue.computed(() => {
      return !props.fixed && table.layout.gutterWidth;
    });

    const isCellHidden = (index, columns, column) => {
      if (props.fixed || props.fixed === 'left') {
        return index >= leftFixedLeafCount.value;
      } else if (props.fixed === 'right') {
        let before = 0;

        for (let i = 0; i < index; i++) {
          before += columns[i].colSpan;
        }

        return before < columnsCount.value - rightFixedLeafCount.value;
      } else if (!props.fixed && column.fixed) {
        // hide cell when footer instance is not fixed and column is fixed
        return true;
      } else {
        return index < leftFixedCount.value || index >= columnsCount.value - rightFixedCount.value;
      }
    };

    const getRowClasses = (column, cellIndex) => {
      const classes = [column.id, column.align, column.labelClassName];

      if (column.className) {
        classes.push(column.className);
      }

      if (isCellHidden(cellIndex, store.states.columns.value, column)) {
        classes.push('is-hidden');
      }

      if (!column.children) {
        classes.push('is-leaf');
      }

      return classes;
    };

    return {
      hasGutter,
      getRowClasses,
      columns
    };
  }

  var TableFooter = {
    name: 'ElTableFooter',
    props: {
      fixed: {
        type: String,
        default: ''
      },
      store: {
        required: true,
        type: Object
      },
      summaryMethod: Function,
      sumText: String,
      border: Boolean,
      defaultSort: {
        type: Object,

        default() {
          return {
            prop: '',
            order: ''
          };
        }

      }
    },

    setup(props) {
      const {
        hasGutter,
        getRowClasses,
        columns
      } = useStyle$2(props);
      return {
        getRowClasses,
        hasGutter,
        columns
      };
    },

    render() {
      let sums = [];

      if (this.summaryMethod) {
        sums = this.summaryMethod({
          columns: this.columns,
          data: this.store.states.data.value
        });
      } else {
        this.columns.forEach((column, index) => {
          if (index === 0) {
            sums[index] = this.sumText;
            return;
          }

          const values = this.store.states.data.value.map(item => Number(item[column.property]));
          const precisions = [];
          let notNumber = true;
          values.forEach(value => {
            if (!isNaN(value)) {
              notNumber = false;
              const decimal = ('' + value).split('.')[1];
              precisions.push(decimal ? decimal.length : 0);
            }
          });
          const precision = Math.max.apply(null, precisions);

          if (!notNumber) {
            sums[index] = values.reduce((prev, curr) => {
              const value = Number(curr);

              if (!isNaN(value)) {
                return parseFloat((prev + curr).toFixed(Math.min(precision, 20)));
              } else {
                return prev;
              }
            }, 0);
          } else {
            sums[index] = '';
          }
        });
      }

      return vue.h('table', {
        class: 'el-table__footer',
        cellspacing: '0',
        cellpadding: '0',
        border: '0'
      }, [hColgroup(this.columns, this.hasGutter), vue.h('tbody', {
        class: [{
          'has-gutter': this.hasGutter
        }]
      }, [vue.h('tr', {}, [...this.columns.map((column, cellIndex) => vue.h('td', {
        key: cellIndex,
        colspan: column.colSpan,
        rowspan: column.rowSpan,
        class: this.getRowClasses(column, cellIndex)
      }, [vue.h('div', {
        class: ['cell', column.labelClassName]
      }, [sums[cellIndex]])])), this.hasGutter && hGutter()])])]);
    }

  };

  function useUtils(store, layout, shouldUpdateHeight) {
    const setCurrentRow = row => {
      store.commit('setCurrentRow', row);
    };

    const toggleRowSelection = (row, selected) => {
      store.toggleRowSelection(row, selected, false);
      store.updateAllSelected();
    };

    const clearSelection = () => {
      store.clearSelection();
    };

    const clearFilter = columnKeys => {
      store.clearFilter(columnKeys);
    };

    const toggleAllSelection = () => {
      store.commit('toggleAllSelection');
    };

    const toggleRowExpansion = (row, expanded) => {
      store.toggleRowExpansionAdapter(row, expanded);
    };

    const clearSort = () => {
      store.clearSort();
    };

    const doLayout = () => {
      if (shouldUpdateHeight.value) {
        layout.updateElsHeight();
      }

      layout.updateColumnsWidth();
    };

    const sort = (prop, order) => {
      store.commit('sort', {
        prop,
        order
      });
    };

    return {
      setCurrentRow,
      toggleRowSelection,
      clearSelection,
      clearFilter,
      toggleAllSelection,
      toggleRowExpansion,
      clearSort,
      doLayout,
      sort
    };
  }

  function useStyle$1(props, layout, store, table, doLayout) {
    const isHidden = vue.ref(false);
    const renderExpanded = vue.ref(null);
    const resizeProxyVisible = vue.ref(false);

    const setDragVisible = visible => {
      resizeProxyVisible.value = visible;
    };

    const resizeState = vue.ref({
      width: null,
      height: null
    });
    const isGroup = vue.ref(false);
    const scrollPosition = vue.ref('left');
    vue.watchEffect(() => {
      layout.setHeight(props.height);
    });
    vue.watchEffect(() => {
      layout.setMaxHeight(props.maxHeight);
    });
    vue.watchEffect(() => {
      if (!store.states.rowKey.value) return;
      store.setCurrentRowKey(props.currentRowKey);
    });
    vue.watch(() => props.data, () => {
      table.store.commit('setData', props.data);
    }, {
      immediate: true
    });
    vue.watchEffect(() => {
      if (props.expandRowKeys) {
        store.setExpandRowKeysAdapter(props.expandRowKeys);
      }
    });

    const handleMouseLeave = () => {
      table.store.commit('setHoverRow', null);
      if (table.hoverState) table.hoverState = null;
    };

    const handleHeaderFooterMousewheel = (event, data) => {
      const {
        pixelX,
        pixelY
      } = data;

      if (Math.abs(pixelX) >= Math.abs(pixelY)) {
        table.refs.bodyWrapper.scrollLeft += data.pixelX / 5;
      }
    };

    const shouldUpdateHeight = vue.computed(() => {
      return props.height || props.maxHeight || store.states.fixedColumns.value.length > 0 || store.states.rightFixedColumns.value.length > 0;
    });
    vue.onMounted(() => {
      bindEvents();
      store.updateColumns();
      doLayout();
      resizeState.value = {
        width: table.vnode.el.offsetWidth,
        height: table.vnode.el.offsetHeight
      }; // init filters

      store.states.columns.value.forEach(column => {
        if (column.filteredValue && column.filteredValue.length) {
          table.store.commit('filterChange', {
            column,
            values: column.filteredValue,
            silent: true
          });
        }
      });
      table.$ready = true;
    });
    const syncPostion = throttle(function () {
      const {
        scrollLeft,
        scrollTop,
        offsetWidth,
        scrollWidth
      } = table.refs.bodyWrapper;
      const {
        headerWrapper,
        footerWrapper,
        fixedBodyWrapper,
        rightFixedBodyWrapper
      } = table.refs;
      if (headerWrapper) headerWrapper.scrollLeft = scrollLeft;
      if (footerWrapper) footerWrapper.scrollLeft = scrollLeft;
      if (fixedBodyWrapper) fixedBodyWrapper.scrollTop = scrollTop;
      if (rightFixedBodyWrapper) rightFixedBodyWrapper.scrollTop = scrollTop;
      const maxScrollLeftPosition = scrollWidth - offsetWidth - 1;

      if (scrollLeft >= maxScrollLeftPosition) {
        scrollPosition.value = 'right';
      } else if (scrollLeft === 0) {
        scrollPosition.value = 'left';
      } else {
        scrollPosition.value = 'middle';
      }
    }, 20);

    const bindEvents = () => {
      table.refs.bodyWrapper.addEventListener('scroll', syncPostion, {
        passive: true
      });

      if (props.fit) {
        addResizeListener(table.vnode.el, resizeListener);
      }
    };

    vue.onUnmounted(() => {
      unbindEvents();
    });

    const unbindEvents = () => {
      var _table$refs$bodyWrapp;

      (_table$refs$bodyWrapp = table.refs.bodyWrapper) === null || _table$refs$bodyWrapp === void 0 ? void 0 : _table$refs$bodyWrapp.removeEventListener('scroll', syncPostion, true);

      if (props.fit) {
        removeResizeListener(table.vnode.el, resizeListener);
      }
    };

    const resizeListener = () => {
      if (!table.$ready) return;
      let shouldUpdateLayout = false;
      const el = table.vnode.el;
      const {
        width: oldWidth,
        height: oldHeight
      } = resizeState.value;
      const width = el.offsetWidth;

      if (oldWidth !== width) {
        shouldUpdateLayout = true;
      }

      const height = el.offsetHeight;

      if ((props.height || shouldUpdateHeight.value) && oldHeight !== height) {
        shouldUpdateLayout = true;
      }

      if (shouldUpdateLayout) {
        resizeState.value = {
          width,
          height
        };
        doLayout();
      }
    };

    const tableSize = vue.computed(() => {
      return props.size;
    });
    const bodyWidth = vue.computed(() => {
      const {
        bodyWidth: bodyWidth_,
        scrollY,
        gutterWidth
      } = layout;
      return bodyWidth_.value ? bodyWidth_.value - (scrollY.value ? gutterWidth : 0) + 'px' : '';
    });
    const bodyHeight = vue.computed(() => {
      const headerHeight = layout.headerHeight.value || 0;
      const bodyHeight = layout.bodyHeight.value;
      const footerHeight = layout.footerHeight.value || 0;

      if (props.height) {
        return {
          height: bodyHeight ? bodyHeight + 'px' : ''
        };
      } else if (props.maxHeight) {
        const maxHeight = parseHeight(props.maxHeight);

        if (typeof maxHeight === 'number') {
          return {
            'max-height': maxHeight - footerHeight - (props.showHeader ? headerHeight : 0) + 'px'
          };
        }
      }

      return {};
    });
    const emptyBlockStyle = vue.computed(() => {
      if (props.data && props.data.length) return null;
      let height = '100%';

      if (layout.appendHeight.value) {
        height = `calc(100% - ${layout.appendHeight.value}px)`;
      }

      return {
        width: bodyWidth.value,
        height
      };
    });
    /**
     * fix layout
     */

    const handleFixedMousewheel = (event, data) => {
      const bodyWrapper = table.refs.bodyWrapper;

      if (Math.abs(data.spinY) > 0) {
        const currentScrollTop = bodyWrapper.scrollTop;

        if (data.pixelY < 0 && currentScrollTop !== 0) {
          event.preventDefault();
        }

        if (data.pixelY > 0 && bodyWrapper.scrollHeight - bodyWrapper.clientHeight > currentScrollTop) {
          event.preventDefault();
        }

        bodyWrapper.scrollTop += Math.ceil(data.pixelY / 5);
      } else {
        bodyWrapper.scrollLeft += Math.ceil(data.pixelX / 5);
      }
    };

    const fixedHeight = vue.computed(() => {
      if (props.maxHeight) {
        if (props.showSummary) {
          return {
            bottom: 0
          };
        }

        return {
          bottom: layout.scrollX.value && props.data.length ? layout.gutterWidth + 'px' : ''
        };
      } else {
        if (props.showSummary) {
          return {
            height: layout.tableHeight.value ? layout.tableHeight.value + 'px' : ''
          };
        }

        return {
          height: layout.viewportHeight.value ? layout.viewportHeight.value + 'px' : ''
        };
      }
    });
    const fixedBodyHeight = vue.computed(() => {
      if (props.height) {
        return {
          height: layout.fixedBodyHeight.value ? layout.fixedBodyHeight.value + 'px' : ''
        };
      } else if (props.maxHeight) {
        let maxHeight = parseHeight(props.maxHeight);

        if (typeof maxHeight === 'number') {
          maxHeight = layout.scrollX.value ? maxHeight - layout.gutterWidth : maxHeight;

          if (props.showHeader) {
            maxHeight -= layout.headerHeight.value;
          }

          maxHeight -= layout.footerHeight.value;
          return {
            'max-height': maxHeight + 'px'
          };
        }
      }

      return {};
    });
    return {
      isHidden,
      renderExpanded,
      setDragVisible,
      isGroup,
      handleMouseLeave,
      handleHeaderFooterMousewheel,
      tableSize,
      bodyHeight,
      emptyBlockStyle,
      handleFixedMousewheel,
      fixedHeight,
      fixedBodyHeight,
      resizeProxyVisible,
      bodyWidth,
      resizeState,
      scrollPosition
    };
  }

  let tableIdSeed = 1;
  var script$P = {
    name: 'ElTable',
    mixins: [Locale],
    directives: {
      Mousewheel
    },
    components: {
      TableHeader,
      TableBody,
      TableFooter
    },
    props: {
      data: {
        type: Array,
        default: function () {
          return [];
        }
      },
      size: String,
      width: [String, Number],
      height: [String, Number],
      maxHeight: [String, Number],
      fit: {
        type: Boolean,
        default: true
      },
      stripe: Boolean,
      border: Boolean,
      rowKey: [String, Function],
      showHeader: {
        type: Boolean,
        default: true
      },
      showSummary: Boolean,
      sumText: String,
      summaryMethod: Function,
      rowClassName: [String, Function],
      rowStyle: [Object, Function],
      cellClassName: [String, Function],
      cellStyle: [Object, Function],
      headerRowClassName: [String, Function],
      headerRowStyle: [Object, Function],
      headerCellClassName: [String, Function],
      headerCellStyle: [Object, Function],
      highlightCurrentRow: Boolean,
      currentRowKey: [String, Number],
      emptyText: String,
      expandRowKeys: Array,
      defaultExpandAll: Boolean,
      defaultSort: Object,
      tooltipEffect: String,
      spanMethod: Function,
      selectOnIndeterminate: {
        type: Boolean,
        default: true
      },
      indent: {
        type: Number,
        default: 16
      },
      treeProps: {
        type: Object,

        default() {
          return {
            hasChildren: 'hasChildren',
            children: 'children'
          };
        }

      },
      lazy: Boolean,
      load: Function
    },
    emits: ['select', 'select-all', 'selection-change', 'cell-mouse-enter', 'cell-mouse-leave', 'cell-click', 'cell-dblclick', 'row-click', 'row-contextmenu', 'row-dblclick', 'header-click', 'header-contextmenu', 'sort-change', 'filter-change', 'current-change', 'header-dragend', 'expand-change'],

    setup(props) {
      let table = vue.getCurrentInstance();
      const store = createStore(table, {
        rowKey: props.rowKey,
        defaultExpandAll: props.defaultExpandAll,
        selectOnIndeterminate: props.selectOnIndeterminate,
        // TreeTable 的相关配置
        indent: props.indent,
        lazy: props.lazy,
        lazyColumnIdentifier: props.treeProps.hasChildren || 'hasChildren',
        childrenColumnName: props.treeProps.children || 'children',
        data: props.data
      });
      table.store = store;
      const layout = new TableLayout({
        store: table.store,
        table,
        fit: props.fit,
        showHeader: props.showHeader
      });
      table.layout = layout;
      const shouldUpdateHeight = vue.computed(() => {
        return props.height || props.maxHeight || store.states.fixedColumns.value.length > 0 || store.states.rightFixedColumns.value.length > 0;
      });
      /**
       * open functions
       */

      const {
        setCurrentRow,
        toggleRowSelection,
        clearSelection,
        clearFilter,
        toggleAllSelection,
        toggleRowExpansion,
        clearSort,
        doLayout,
        sort
      } = useUtils(store, layout, shouldUpdateHeight);
      const {
        isHidden,
        renderExpanded,
        setDragVisible,
        isGroup,
        handleMouseLeave,
        handleHeaderFooterMousewheel,
        tableSize,
        bodyHeight,
        emptyBlockStyle,
        handleFixedMousewheel,
        fixedHeight,
        fixedBodyHeight,
        resizeProxyVisible,
        bodyWidth,
        resizeState,
        scrollPosition
      } = useStyle$1(props, layout, store, table, doLayout);
      const debouncedUpdateLayout = debounce(() => doLayout(), 50);
      const tableId = 'el-table_' + tableIdSeed++;
      table.tableId = tableId;
      table.state = {
        isGroup,
        resizeState,
        doLayout,
        debouncedUpdateLayout
      };
      return {
        layout,
        store,
        handleHeaderFooterMousewheel,
        handleMouseLeave,
        tableId,
        tableSize,
        isHidden,
        renderExpanded,
        resizeProxyVisible,
        resizeState,
        isGroup,
        scrollPosition,
        bodyWidth,
        bodyHeight,
        emptyBlockStyle,
        debouncedUpdateLayout,
        handleFixedMousewheel,
        fixedHeight,
        fixedBodyHeight,
        setCurrentRow,
        toggleRowSelection,
        clearSelection,
        clearFilter,
        toggleAllSelection,
        toggleRowExpansion,
        clearSort,
        doLayout,
        sort,
        setDragVisible,
        context: table
      };
    }

  };

  const _hoisted_1$y = {
    ref: "hiddenColumns",
    class: "hidden-columns"
  };
  const _hoisted_2$k = {
    key: 0,
    ref: "headerWrapper",
    class: "el-table__header-wrapper"
  };
  const _hoisted_3$g = {
    class: "el-table__empty-text"
  };
  const _hoisted_4$a = {
    key: 1,
    ref: "appendWrapper",
    class: "el-table__append-wrapper"
  };
  const _hoisted_5$6 = {
    key: 1,
    ref: "footerWrapper",
    class: "el-table__footer-wrapper"
  };
  const _hoisted_6$4 = {
    key: 0,
    ref: "fixedHeaderWrapper",
    class: "el-table__fixed-header-wrapper"
  };
  const _hoisted_7$3 = {
    key: 1,
    ref: "fixedFooterWrapper",
    class: "el-table__fixed-footer-wrapper"
  };
  const _hoisted_8$2 = {
    key: 0,
    ref: "rightFixedHeaderWrapper",
    class: "el-table__fixed-header-wrapper"
  };
  const _hoisted_9$2 = {
    key: 1,
    ref: "rightFixedFooterWrapper",
    class: "el-table__fixed-footer-wrapper"
  };
  const _hoisted_10 = {
    ref: "resizeProxy",
    class: "el-table__column-resize-proxy"
  };
  function render$I(_ctx, _cache, $props, $setup, $data, $options) {
    const _component_table_header = vue.resolveComponent("table-header");

    const _component_table_body = vue.resolveComponent("table-body");

    const _component_table_footer = vue.resolveComponent("table-footer");

    const _directive_mousewheel = vue.resolveDirective("mousewheel");

    return vue.openBlock(), vue.createBlock("div", {
      class: [[{
        'el-table--fit': $props.fit,
        'el-table--striped': $props.stripe,
        'el-table--border': $props.border || $setup.isGroup,
        'el-table--hidden': $setup.isHidden,
        'el-table--group': $setup.isGroup,
        'el-table--fluid-height': $props.maxHeight,
        'el-table--scrollable-x': $setup.layout.scrollX.value,
        'el-table--scrollable-y': $setup.layout.scrollY.value,
        'el-table--enable-row-hover': !$setup.store.states.isComplex.value,
        'el-table--enable-row-transition': ($setup.store.states.data.value || []).length !== 0 && ($setup.store.states.data.value || []).length < 100
      }, $setup.tableSize ? `el-table--${$setup.tableSize}` : ''], "el-table"],
      onMouseleave: _cache[1] || (_cache[1] = $event => $setup.handleMouseLeave())
    }, [vue.createVNode("div", _hoisted_1$y, [vue.renderSlot(_ctx.$slots, "default")], 512
    /* NEED_PATCH */
    ), $props.showHeader ? vue.withDirectives((vue.openBlock(), vue.createBlock("div", _hoisted_2$k, [vue.createVNode(_component_table_header, {
      ref: "tableHeader",
      border: $props.border,
      "default-sort": $props.defaultSort,
      store: $setup.store,
      style: {
        width: $setup.layout.bodyWidth.value ? $setup.layout.bodyWidth.value + 'px' : ''
      },
      onSetDragVisible: $setup.setDragVisible
    }, null, 8
    /* PROPS */
    , ["border", "default-sort", "store", "style", "onSetDragVisible"])], 512
    /* NEED_PATCH */
    )), [[_directive_mousewheel, $setup.handleHeaderFooterMousewheel]]) : vue.createCommentVNode("v-if", true), vue.createVNode("div", {
      ref: "bodyWrapper",
      class: [[$setup.layout.scrollX.value ? `is-scrolling-${$setup.scrollPosition}` : 'is-scrolling-none'], "el-table__body-wrapper"],
      style: [$setup.bodyHeight]
    }, [vue.createVNode(_component_table_body, {
      context: $setup.context,
      highlight: $props.highlightCurrentRow,
      "row-class-name": $props.rowClassName,
      "row-style": $props.rowStyle,
      store: $setup.store,
      stripe: $props.stripe,
      style: {
        width: $setup.bodyWidth
      }
    }, null, 8
    /* PROPS */
    , ["context", "highlight", "row-class-name", "row-style", "store", "stripe", "style"]), !$props.data || $props.data.length === 0 ? (vue.openBlock(), vue.createBlock("div", {
      key: 0,
      ref: "emptyBlock",
      style: $setup.emptyBlockStyle,
      class: "el-table__empty-block"
    }, [vue.createVNode("span", _hoisted_3$g, [vue.renderSlot(_ctx.$slots, "empty", {}, () => [vue.createTextVNode(vue.toDisplayString($props.emptyText || _ctx.t('el.table.emptyText')), 1
    /* TEXT */
    )])])], 4
    /* STYLE */
    )) : vue.createCommentVNode("v-if", true), _ctx.$slots.append ? (vue.openBlock(), vue.createBlock("div", _hoisted_4$a, [vue.renderSlot(_ctx.$slots, "append")], 512
    /* NEED_PATCH */
    )) : vue.createCommentVNode("v-if", true)], 6
    /* CLASS, STYLE */
    ), $props.showSummary ? vue.withDirectives((vue.openBlock(), vue.createBlock("div", _hoisted_5$6, [vue.createVNode(_component_table_footer, {
      border: $props.border,
      "default-sort": $props.defaultSort,
      store: $setup.store,
      style: {
        width: $setup.layout.bodyWidth.value ? $setup.layout.bodyWidth.value + 'px' : ''
      },
      "sum-text": $props.sumText || _ctx.t('el.table.sumText'),
      "summary-method": $props.summaryMethod
    }, null, 8
    /* PROPS */
    , ["border", "default-sort", "store", "style", "sum-text", "summary-method"])], 512
    /* NEED_PATCH */
    )), [[vue.vShow, $props.data && $props.data.length > 0], [_directive_mousewheel, $setup.handleHeaderFooterMousewheel]]) : vue.createCommentVNode("v-if", true), $setup.store.states.fixedColumns.value.length > 0 ? vue.withDirectives((vue.openBlock(), vue.createBlock("div", {
      key: 2,
      ref: "fixedWrapper",
      style: [{
        width: $setup.layout.fixedWidth.value ? $setup.layout.fixedWidth.value + 'px' : ''
      }, $setup.fixedHeight],
      class: "el-table__fixed"
    }, [$props.showHeader ? (vue.openBlock(), vue.createBlock("div", _hoisted_6$4, [vue.createVNode(_component_table_header, {
      ref: "fixedTableHeader",
      border: $props.border,
      store: $setup.store,
      style: {
        width: $setup.bodyWidth
      },
      fixed: "left",
      onSetDragVisible: $setup.setDragVisible
    }, null, 8
    /* PROPS */
    , ["border", "store", "style", "onSetDragVisible"])], 512
    /* NEED_PATCH */
    )) : vue.createCommentVNode("v-if", true), vue.createVNode("div", {
      ref: "fixedBodyWrapper",
      style: [{
        top: $setup.layout.headerHeight.value + 'px'
      }, $setup.fixedBodyHeight],
      class: "el-table__fixed-body-wrapper"
    }, [vue.createVNode(_component_table_body, {
      highlight: $props.highlightCurrentRow,
      "row-class-name": $props.rowClassName,
      "row-style": $props.rowStyle,
      store: $setup.store,
      stripe: $props.stripe,
      style: {
        width: $setup.bodyWidth
      },
      fixed: "left"
    }, null, 8
    /* PROPS */
    , ["highlight", "row-class-name", "row-style", "store", "stripe", "style"]), _ctx.$slots.append ? (vue.openBlock(), vue.createBlock("div", {
      key: 0,
      style: {
        height: $setup.layout.appendHeight.value + 'px'
      },
      class: "el-table__append-gutter"
    }, null, 4
    /* STYLE */
    )) : vue.createCommentVNode("v-if", true)], 4
    /* STYLE */
    ), $props.showSummary ? vue.withDirectives((vue.openBlock(), vue.createBlock("div", _hoisted_7$3, [vue.createVNode(_component_table_footer, {
      border: $props.border,
      store: $setup.store,
      style: {
        width: $setup.bodyWidth
      },
      "sum-text": $props.sumText || _ctx.t('el.table.sumText'),
      "summary-method": $props.summaryMethod,
      fixed: "left"
    }, null, 8
    /* PROPS */
    , ["border", "store", "style", "sum-text", "summary-method"])], 512
    /* NEED_PATCH */
    )), [[vue.vShow, $props.data && $props.data.length > 0]]) : vue.createCommentVNode("v-if", true)], 4
    /* STYLE */
    )), [[_directive_mousewheel, $setup.handleFixedMousewheel]]) : vue.createCommentVNode("v-if", true), $setup.store.states.rightFixedColumns.value.length > 0 ? vue.withDirectives((vue.openBlock(), vue.createBlock("div", {
      key: 3,
      ref: "rightFixedWrapper",
      style: [{
        width: $setup.layout.rightFixedWidth.value ? $setup.layout.rightFixedWidth.value + 'px' : '',
        right: $setup.layout.scrollY.value ? ($props.border ? $setup.layout.gutterWidth : $setup.layout.gutterWidth || 0) + 'px' : ''
      }, $setup.fixedHeight],
      class: "el-table__fixed-right"
    }, [$props.showHeader ? (vue.openBlock(), vue.createBlock("div", _hoisted_8$2, [vue.createVNode(_component_table_header, {
      ref: "rightFixedTableHeader",
      border: $props.border,
      store: $setup.store,
      style: {
        width: $setup.bodyWidth
      },
      fixed: "right",
      onSetDragVisible: $setup.setDragVisible
    }, null, 8
    /* PROPS */
    , ["border", "store", "style", "onSetDragVisible"])], 512
    /* NEED_PATCH */
    )) : vue.createCommentVNode("v-if", true), vue.createVNode("div", {
      ref: "rightFixedBodyWrapper",
      style: [{
        top: $setup.layout.headerHeight.value + 'px'
      }, $setup.fixedBodyHeight],
      class: "el-table__fixed-body-wrapper"
    }, [vue.createVNode(_component_table_body, {
      highlight: $props.highlightCurrentRow,
      "row-class-name": $props.rowClassName,
      "row-style": $props.rowStyle,
      store: $setup.store,
      stripe: $props.stripe,
      style: {
        width: $setup.bodyWidth
      },
      fixed: "right"
    }, null, 8
    /* PROPS */
    , ["highlight", "row-class-name", "row-style", "store", "stripe", "style"]), _ctx.$slots.append ? (vue.openBlock(), vue.createBlock("div", {
      key: 0,
      style: {
        height: $setup.layout.appendHeight.value + 'px'
      },
      class: "el-table__append-gutter"
    }, null, 4
    /* STYLE */
    )) : vue.createCommentVNode("v-if", true)], 4
    /* STYLE */
    ), $props.showSummary ? vue.withDirectives((vue.openBlock(), vue.createBlock("div", _hoisted_9$2, [vue.createVNode(_component_table_footer, {
      border: $props.border,
      store: $setup.store,
      style: {
        width: $setup.bodyWidth
      },
      "sum-text": $props.sumText || _ctx.t('el.table.sumText'),
      "summary-method": $props.summaryMethod,
      fixed: "right"
    }, null, 8
    /* PROPS */
    , ["border", "store", "style", "sum-text", "summary-method"])], 512
    /* NEED_PATCH */
    )), [[vue.vShow, $props.data && $props.data.length > 0]]) : vue.createCommentVNode("v-if", true)], 4
    /* STYLE */
    )), [[_directive_mousewheel, $setup.handleFixedMousewheel]]) : vue.createCommentVNode("v-if", true), $setup.store.states.rightFixedColumns.value.length > 0 ? (vue.openBlock(), vue.createBlock("div", {
      key: 4,
      ref: "rightFixedPatch",
      style: {
        width: $setup.layout.scrollY.value ? $setup.layout.gutterWidth + 'px' : '0',
        height: $setup.layout.headerHeight.value + 'px'
      },
      class: "el-table__fixed-right-patch"
    }, null, 4
    /* STYLE */
    )) : vue.createCommentVNode("v-if", true), vue.withDirectives(vue.createVNode("div", _hoisted_10, null, 512
    /* NEED_PATCH */
    ), [[vue.vShow, $setup.resizeProxyVisible]])], 34
    /* CLASS, HYDRATE_EVENTS */
    );
  }

  script$P.render = render$I;
  script$P.__file = "packages/table/src/table.vue";

  script$P.install = function (app) {
    app.component(script$P.name, script$P);
  };

  const cellStarts = {
    default: {
      order: ''
    },
    selection: {
      width: 48,
      minWidth: 48,
      realWidth: 48,
      order: '',
      className: 'el-table-column--selection'
    },
    expand: {
      width: 48,
      minWidth: 48,
      realWidth: 48,
      order: ''
    },
    index: {
      width: 48,
      minWidth: 48,
      realWidth: 48,
      order: ''
    }
  }; // 这些选项不应该被覆盖

  const cellForced = {
    selection: {
      renderHeader: function ({
        store
      }) {
        return vue.h(script$1o, {
          disabled: store.states.data.value && store.states.data.value.length === 0,
          indeterminate: store.states.selection.value.length > 0 && !store.states.isAllSelected.value,
          onClick: store.toggleAllSelection,
          modelValue: store.states.isAllSelected.value
        });
      },
      renderCell: function ({
        row,
        column,
        store,
        index_
      }) {
        return vue.h(script$1o, {
          disabled: column.selectable ? !column.selectable.call(null, row, index_) : false,
          onInput: () => {
            store.commit('rowSelectedChanged', row);
          },
          nativeOnClick: event => event.stopPropagation(),
          modelValue: store.isSelected(row)
        });
      },
      sortable: false,
      resizable: false
    },
    index: {
      renderHeader: function ({
        column
      }) {
        return column.label || '#';
      },
      renderCell: function ({
        index_,
        column
      }) {
        let i = index_ + 1;
        const index = column.index;

        if (typeof index === 'number') {
          i = index_ + index;
        } else if (typeof index === 'function') {
          i = index(index_);
        }

        return vue.h('div', {}, [i]);
      },
      sortable: false
    },
    expand: {
      renderHeader: function ({
        column
      }) {
        return column.label || '';
      },
      renderCell: function ({
        row,
        store
      }) {
        const classes = ['el-table__expand-icon'];

        if (store.states.expandRows.value.indexOf(row) > -1) {
          classes.push('el-table__expand-icon--expanded');
        }

        const callback = function (e) {
          e.stopPropagation();
          store.toggleRowExpansion(row);
        };

        return vue.h('div', {
          class: classes,
          onClick: callback
        }, [vue.h('i', {
          class: 'el-icon el-icon-arrow-right'
        })]);
      },
      sortable: false,
      resizable: false,
      className: 'el-table__expand-column'
    }
  };
  function defaultRenderCell({
    row,
    column,
    index_
  }) {
    const property = column.property;
    const value = property && getPropByPath(row, property, false).v;

    if (column && column.formatter) {
      return column.formatter(row, column, value, index_);
    }

    return value;
  }
  function treeCellPrefix({
    row,
    treeNode,
    store
  }) {
    if (!treeNode) return null;
    const ele = [];

    const callback = function (e) {
      e.stopPropagation();
      store.loadOrToggle(row);
    };

    if (treeNode.indent) {
      ele.push(vue.h('span', {
        class: 'el-table__indent',
        style: {
          'padding-left': treeNode.indent + 'px'
        }
      }));
    }

    if (typeof treeNode.expanded === 'boolean' && !treeNode.noLazyChildren) {
      const expandClasses = ['el-table__expand-icon', treeNode.expanded ? 'el-table__expand-icon--expanded' : ''];
      let iconClasses = ['el-icon-arrow-right'];

      if (treeNode.loading) {
        iconClasses = ['el-icon-loading'];
      }

      ele.push(vue.h('div', {
        class: expandClasses,
        onClick: callback
      }, [vue.h('i', {
        class: iconClasses
      })]));
    } else {
      ele.push(vue.h('span', {
        class: 'el-table__placeholder'
      }));
    }

    return ele;
  }

  function useWatcher(owner, props_) {
    const instance = vue.getCurrentInstance();

    const registerComplexWatchers = () => {
      const props = ['fixed'];
      const aliases = {
        realWidth: 'width',
        realMinWidth: 'minWidth'
      };
      const allAliases = props.reduce((prev, cur) => {
        prev[cur] = cur;
        return prev;
      }, aliases);
      Object.keys(allAliases).forEach(key => {
        const columnKey = aliases[key]; // eslint-disable-next-line no-prototype-builtins

        if (props_.hasOwnProperty(columnKey)) {
          vue.watch(() => props_[columnKey], newVal => {
            instance.columnConfig.value[columnKey] = newVal;
            const updateColumns = columnKey === 'fixed';
            owner.value.store.scheduleLayout(updateColumns);
          });
        }
      });
    };

    const registerNormalWatchers = () => {
      const props = ['label', 'property', 'filters', 'filterMultiple', 'sortable', 'index', 'formatter', 'className', 'labelClassName', 'showOverflowTooltip']; // 一些属性具有别名

      const aliases = {
        prop: 'property',
        realAlign: 'align',
        realHeaderAlign: 'headerAlign'
      };
      const allAliases = props.reduce((prev, cur) => {
        prev[cur] = cur;
        return prev;
      }, aliases);
      Object.keys(allAliases).forEach(key => {
        const columnKey = aliases[key]; // eslint-disable-next-line no-prototype-builtins

        if (props_.hasOwnProperty(columnKey)) {
          vue.watch(() => props_[columnKey], newVal => {
            instance.columnConfig.value[columnKey] = newVal;
          });
        }
      });
    };

    return {
      registerComplexWatchers,
      registerNormalWatchers
    };
  }

  function useRender(props, slots, owner) {
    const instance = vue.getCurrentInstance();
    const columnId = vue.ref('');
    const isSubColumn = vue.ref(false);
    const realAlign = vue.ref();
    const realHeaderAlign = vue.ref();
    vue.watchEffect(() => {
      realAlign.value = props.align ? 'is-' + props.align : null; // nextline help render

      realAlign.value;
    });
    vue.watchEffect(() => {
      realHeaderAlign.value = props.headerAlign ? 'is-' + props.headerAlign : realAlign.value; // nextline help render

      realHeaderAlign.value;
    });
    const columnOrTableParent = vue.computed(() => {
      let parent = instance.vnode.vParent || instance.parent;

      while (parent && !parent.tableId && !parent.columnId) {
        parent = parent.vnode.vParent || parent.parent;
      }

      return parent;
    });
    const realWidth = vue.ref(parseWidth(props.width));
    const realMinWidth = vue.ref(parseMinWidth(props.minWidth));

    const setColumnWidth = column => {
      if (realWidth.value) column.width = realWidth.value;

      if (realMinWidth.value) {
        column.minWidth = realMinWidth.value;
      }

      if (!column.minWidth) {
        column.minWidth = 80;
      }

      column.realWidth = column.width === undefined ? column.minWidth : column.width;
      return column;
    };

    const setColumnForcedProps = column => {
      // 对于特定类型的 column，某些属性不允许设置
      const type = column.type;
      const source = cellForced[type] || {};
      Object.keys(source).forEach(prop => {
        const value = source[prop];

        if (value !== undefined) {
          column[prop] = prop === 'className' ? `${column[prop]} ${value}` : value;
        }
      });
      return column;
    };

    const checkSubColumn = children => {
      if (children instanceof Array) {
        children.forEach(child => check(child));
      } else {
        check(children);
      }

      function check(item) {
        var _item$type;

        if ((item === null || item === void 0 ? void 0 : (_item$type = item.type) === null || _item$type === void 0 ? void 0 : _item$type.name) === 'ElTableColumn') {
          item.vParent = instance;
        }
      }
    };

    const setColumnRenders = column => {
      // renderHeader 属性不推荐使用。
      if (props.renderHeader) {
        console.warn('[Element Warn][TableColumn]Comparing to render-header, scoped-slot header is easier to use. We recommend users to use scoped-slot header.');
      } else if (column.type !== 'selection') {
        column.renderHeader = scope => {
          // help render
          instance.columnConfig.value['label'];
          const renderHeader = slots.header;
          return renderHeader ? renderHeader(scope) : column.label;
        };
      }

      let originRenderCell = column.renderCell; // TODO: 这里的实现调整

      if (column.type === 'expand') {
        // 对于展开行，renderCell 不允许配置的。在上一步中已经设置过，这里需要简单封装一下。
        column.renderCell = data => vue.h('div', {
          class: 'cell'
        }, [originRenderCell(data)]);

        owner.value.renderExpanded = data => {
          return slots.default ? slots.default(data) : slots.default;
        };
      } else {
        originRenderCell = originRenderCell || defaultRenderCell; // 对 renderCell 进行包装

        column.renderCell = data => {
          let children = null;

          if (slots.default) {
            children = slots.default(data);
          } else {
            children = originRenderCell(data);
          }

          const prefix = treeCellPrefix(data);
          const props = {
            class: 'cell',
            style: {}
          };

          if (column.showOverflowTooltip) {
            props.class += ' el-tooltip';
            props.style = {
              width: (data.column.realWidth || data.column.width) - 1 + 'px'
            };
          }

          checkSubColumn(children);
          return vue.h('div', props, [prefix, children]);
        };
      }

      return column;
    };

    const getPropsData = (...propsKey) => {
      return propsKey.reduce((prev, cur) => {
        if (Array.isArray(cur)) {
          cur.forEach(key => {
            prev[key] = props[key];
          });
        }

        return prev;
      }, {});
    };

    const getColumnElIndex = (children, child) => {
      return [].indexOf.call(children, child);
    };

    return {
      columnId,
      realAlign,
      isSubColumn,
      realHeaderAlign,
      columnOrTableParent,
      setColumnWidth,
      setColumnForcedProps,
      setColumnRenders,
      getPropsData,
      getColumnElIndex
    };
  }

  let columnIdSeed = 1;
  var ElTableColumn = {
    name: 'ElTableColumn',
    components: {
      ElCheckbox: script$1o
    },
    props: {
      type: {
        type: String,
        default: 'default'
      },
      label: String,
      className: String,
      labelClassName: String,
      property: String,
      prop: String,
      width: {
        type: [Object, Number, String],
        default: () => {
          return {};
        }
      },
      minWidth: {
        type: [Object, Number, String],
        default: () => {
          return {};
        }
      },
      renderHeader: Function,
      sortable: {
        type: [Boolean, String],
        default: false
      },
      sortMethod: Function,
      sortBy: [String, Function, Array],
      resizable: {
        type: Boolean,
        default: true
      },
      columnKey: String,
      align: String,
      headerAlign: String,
      showTooltipWhenOverflow: Boolean,
      showOverflowTooltip: Boolean,
      fixed: [Boolean, String],
      formatter: Function,
      selectable: Function,
      reserveSelection: Boolean,
      filterMethod: Function,
      filteredValue: Array,
      filters: Array,
      filterPlacement: String,
      filterMultiple: {
        type: Boolean,
        default: true
      },
      index: [Number, Function],
      sortOrders: {
        type: Array,

        default() {
          return ['ascending', 'descending', null];
        },

        validator(val) {
          return val.every(order => ['ascending', 'descending', null].indexOf(order) > -1);
        }

      }
    },

    setup(props, {
      slots
    }) {
      const instance = vue.getCurrentInstance();
      const columnConfig = vue.ref({});
      const row = vue.ref({});
      const r = vue.ref({});
      const index_ = vue.ref(0);
      const owner = vue.computed(() => {
        let parent = instance.parent;

        while (parent && !parent.tableId) {
          parent = parent.parent;
        }

        return parent;
      });
      const {
        registerNormalWatchers,
        registerComplexWatchers
      } = useWatcher(owner, props);
      const {
        columnId,
        isSubColumn,
        realHeaderAlign,
        columnOrTableParent,
        setColumnWidth,
        setColumnForcedProps,
        setColumnRenders,
        getPropsData,
        getColumnElIndex,
        realAlign
      } = useRender(props, slots, owner);
      const parent = columnOrTableParent.value;
      columnId.value = (parent.tableId || parent.columnId) + '_column_' + columnIdSeed++;
      vue.onBeforeMount(() => {
        isSubColumn.value = owner.value !== parent;
        const type = props.type || 'default';
        const sortable = props.sortable === '' ? true : props.sortable;
        const defaults = { ...cellStarts[type],
          id: columnId.value,
          type: type,
          property: props.prop || props.property,
          align: realAlign,
          headerAlign: realHeaderAlign,
          showOverflowTooltip: props.showOverflowTooltip || props.showTooltipWhenOverflow,
          // filter 相关属性
          filterable: props.filters || props.filterMethod,
          filteredValue: [],
          filterPlacement: '',
          isColumnGroup: false,
          filterOpened: false,
          // sort 相关属性
          sortable: sortable,
          // index 列
          index: props.index
        };
        const basicProps = ['columnKey', 'label', 'className', 'labelClassName', 'type', 'renderHeader', 'formatter', 'fixed', 'resizable'];
        const sortProps = ['sortMethod', 'sortBy', 'sortOrders'];
        const selectProps = ['selectable', 'reserveSelection'];
        const filterProps = ['filterMethod', 'filters', 'filterMultiple', 'filterOpened', 'filteredValue', 'filterPlacement'];
        let column = getPropsData(basicProps, sortProps, selectProps, filterProps);
        column = mergeOptions$1(defaults, column); // 注意 compose 中函数执行的顺序是从右到左

        const chains = compose(setColumnRenders, setColumnWidth, setColumnForcedProps);
        column = chains(column);
        columnConfig.value = column; // 注册 watcher

        registerNormalWatchers();
        registerComplexWatchers();
      });
      vue.onMounted(() => {
        var _parent$refs$hiddenCo;

        const parent = columnOrTableParent.value;
        const children = isSubColumn.value ? parent.vnode.el.children : (_parent$refs$hiddenCo = parent.refs.hiddenColumns) === null || _parent$refs$hiddenCo === void 0 ? void 0 : _parent$refs$hiddenCo.children;
        const columnIndex = getColumnElIndex(children || [], instance.vnode.el);
        owner.value.store.commit('insertColumn', columnConfig.value, columnIndex, isSubColumn.value ? parent.columnConfig.value : null);
      });
      instance.columnId = columnId.value; // eslint-disable-next-line

      instance.columnConfig = columnConfig;
      return {
        row,
        r,
        index_,
        columnId,
        columnConfig
      };
    },

    render() {
      var _this$$slots$default, _this$$slots;

      return vue.h('div', (_this$$slots$default = (_this$$slots = this.$slots).default) === null || _this$$slots$default === void 0 ? void 0 : _this$$slots$default.call(_this$$slots, {
        store: {},
        _self: {},
        column: {},
        row: {},
        index_: undefined
      }));
    }

  };

  /* istanbul ignore next */

  ElTableColumn.install = function (app) {
    app.component(ElTableColumn.name, ElTableColumn);
  };

  var script$O = vue.defineComponent({
    name: 'ElNewTable',
    props: ['data'],

    setup(props) {
      const {
        data
      } = vue.toRefs(props);
      useProvide();
      const {
        columns,
        registryColumn
      } = useColumns();
      const {
        tableHeads
      } = useTableHeads(columns);
      const {
        rows
      } = useRows(data, tableHeads);
      return {
        registryColumn,
        tableHeads,
        rows
      };
    }

  });

  function useProvide() {
    const instance = vue.getCurrentInstance();
    vue.provide('table', instance.proxy);
  }

  function useColumns() {
    const columns = vue.ref([]);

    function registryColumn(column) {
      columns.value.push(column);
    }

    return {
      columns,
      registryColumn
    };
  }

  function useTableHeads(columns) {
    const tableHeads = vue.computed(() => {
      return columns.value.map(columnVM => {
        const {
          prop,
          label
        } = columnVM.props;
        return {
          prop,
          label
        };
      });
    });
    return {
      tableHeads
    };
  }

  function useRows(data, tableHeads) {
    const rows = vue.computed(() => {
      return data.value.map(item => {
        return tableHeads.value.reduce((result, {
          prop: key
        }) => {
          result[key] = item[key];
          return result;
        }, {});
      });
    });
    return {
      rows
    };
  }

  function render$H(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("table", null, [vue.createVNode("thead", null, [vue.createVNode("tr", null, [(vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList(_ctx.tableHeads, (column, index) => {
      return vue.openBlock(), vue.createBlock("th", {
        key: index
      }, vue.toDisplayString(column.label), 1
      /* TEXT */
      );
    }), 128
    /* KEYED_FRAGMENT */
    ))])]), vue.createVNode("tbody", null, [(vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList(_ctx.rows, (row, index) => {
      return vue.openBlock(), vue.createBlock("tr", {
        key: index
      }, [(vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList(row, (val, key) => {
        return vue.openBlock(), vue.createBlock("td", {
          key: key
        }, vue.toDisplayString(val), 1
        /* TEXT */
        );
      }), 128
      /* KEYED_FRAGMENT */
      ))]);
    }), 128
    /* KEYED_FRAGMENT */
    ))]), vue.renderSlot(_ctx.$slots, "default")]);
  }

  script$O.render = render$H;
  script$O.__file = "src/components/Table/src/Table.vue";

  script$O.install = function (app) {
    app.component(script$O.name, script$O);
  };

  var script$N = vue.defineComponent({
    name: 'ElNewTableColumn',
    props: ['prop', 'label'],

    setup() {
      registrySelfToParent();
    }

  });

  function registrySelfToParent() {
    const instance = vue.getCurrentInstance();
    const table = vue.inject('table');

    if (table) {
      table.registryColumn(instance);
    }
  }

  function render$G(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("div");
  }

  script$N.render = render$G;
  script$N.__file = "src/components/TableColumn/src/TableColumn.vue";

  script$N.install = function (app) {
    app.component(script$N.name, script$N);
  };

  /* eslint-disable @typescript-eslint/no-this-alias */
  const typeFlag = Symbol('TREE_NODE');
  /**
   *
   * @param {*} id
   * @param {string} label
   * @param {TreeNode[]} childNodes
   * @param {object} param3
   */

  class TreeNode {
    constructor(id, label, childNodes = [], {
      /* 默认值 */
      parent = null,
      isAsync = false,
      isVisable = true,
      isChecked = false,
      isIndeterminate = false,
      isExpanded = false,
      isDisabled = false,
      isDraggable = false,
      isLeaf = false,
      data = {},
      asyncLoadFn = () => null
    } = {}, {
      /* 拦截函数 */
      insertChild = null,
      appendChild = null,
      removeChild = null
    } = {}) {
      this.id = id || label;
      this.label = label;
      this.parent = parent;
      this.childNodes = childNodes;
      this.isVisable = isVisable;
      this.isChecked = isChecked;
      this.isIndeterminate = isIndeterminate;
      this.isExpanded = isExpanded;
      this.isDisabled = isDisabled;
      this.isDraggable = isDraggable;
      this.isRendered = false;
      this.data = data; // Additional data carried by the node

      this.isLeaf = isLeaf;
      this.isAsync = isAsync; // Load child only at expand time

      this.asyncState = 'notload'; // notload || loaded || loading

      this.asyncLoadFn = asyncLoadFn; // (currentNode, resolveFn) async load child node

      this.interceptHandler = {
        insertChild,
        appendChild,
        removeChild
      }; // this.cache = {
      //   level: null
      // }
      // not use, You can cache read-only properties here

      this.updateChildParent();
      this.updateChildChecked();
      this.updateCheckedState();
      this.updateExpandedState();
    }

    get root() {
      // readonly
      let root = this;
      this.upwardEach(node => {
        root = node;
      });
      return root;
    }

    get isLeaf() {
      return this.isAsync ? this.asyncState === 'loaded' && this.childNodes.length === 0 : this.childNodes.length === 0;
    }

    set isLeaf(v) {
      if (v) this.asyncState = 'loaded';
    }

    get isRoot() {
      // readonly
      return this.root === this;
    }

    get level() {
      // readonly
      if (!this.parent) return 0;
      return this.parent.level + 1;
    }

    get type() {
      // readonly
      return typeFlag;
    }

    get index() {
      // readonly
      const parent = this.parent;
      if (!parent) return -1;
      return parent.findChildIndex(this);
    }

    get checkedNodes() {
      return this.childNodes.filter(treeNode => treeNode.isChecked && !treeNode.isIndeterminate);
    }

    loadAsync() {
      if (!this.isAsync || this.asyncState !== 'notload') {
        return;
      }

      const resolveFn = (childNodes = []) => {
        // this.childNodes = []
        this.append(...childNodes);
        this.asyncState = 'loaded';
      };

      this.asyncState = 'loading';
      this.asyncLoadFn(this, resolveFn);
    }

    updateChildParent() {
      this.childNodes.forEach(node => {
        node.parent = this;
      });
    }

    updateChildChecked() {
      if (this.isChecked) {
        this.setChildChecked(true);
      }
    }

    updateCheckedState() {
      if (this.isLeaf) {
        return;
      } // not leaf node exec


      const checkedNodeLen = this.getCheckedNode().length;
      const childrenNodeLen = this.childNodes.length;

      if (childrenNodeLen === 0) {
        return;
      }

      if (checkedNodeLen === childrenNodeLen) {
        // full select
        this.setCheckedState(1);
      } else if (checkedNodeLen === 0) {
        // not full select
        this.setCheckedState(0);
      } else {
        // Half select
        this.setCheckedState(2);
      }
    }

    updateExpandedState() {
      const childNodes = this.childNodes;

      for (let i = 0; i < childNodes.length; i++) {
        const node = childNodes[i];

        if (node.isExpanded) {
          this.isExpanded = true;
          return;
        }
      }
    }
    /**
     *
     * @param {TreeNode} node
     */


    appendChild(node) {
      if (this.interceptHandler.appendChild) {
        const [_node] = this.interceptHandler.appendChild.apply(this, arguments);
        if (typeof _node !== 'undefined') node = _node;
      }

      if (!TreeNode.isType(node)) {
        return false;
      }

      node.parent = this;

      if (this.isChecked) {
        node.setChecked(true);
      }

      this.childNodes.push(node);
      return true;
    }

    append(...nodes) {
      nodes.forEach(node => {
        this.appendChild(node);
      });
      return true;
    }
    /**
     *
     * @param {number} index
     * @param {TreeNode} node
     */


    insertChild(index, node) {
      if (this.interceptHandler.appendChild) {
        const [_index, _node] = this.interceptHandler.insertChild.apply(this, arguments);
        if (typeof _index !== 'undefined') index = _index;
        if (typeof _node !== 'undefined') node = _node;
      }

      if (!TreeNode.isType(node)) {
        return false;
      }

      if (this.isChecked) {
        node.setChecked(true);
      }

      node.parent = this;
      this.childNodes.splice(index, 0, node);
      return true;
    }

    insert() {
      this.insertChild.apply(this, arguments);
    }
    /**
     *
     * @param {number} index
     */


    removeChild(index) {
      if (this.interceptHandler.appendChild) {
        this.interceptHandler.removeChild.apply(this, arguments);
      }

      if (index < 0 || index >= this.childNodes.length) {
        return false;
      }

      this.childNodes.splice(index, 1);
      return true;
    }

    remove() {
      if (!this.parent) {
        return false;
      }

      return this.parent.removeChild(this.index);
    }
    /**
     *
     * @param {boolean} value
     */


    setChecked(value, strictly = false) {
      this.isIndeterminate = false;

      let _value = !this.isChecked;

      if (typeof value !== 'undefined') {
        _value = value;
      }

      this.isChecked = _value;

      if (!strictly) {
        this.upwardEach(node => {
          if (!node.isDisabled) this.updateCheckedState.call(node);
        });
        this.depthEach(node => {
          if (!node.isDisabled && node.isVisable) node.isChecked = _value;
        });
      }

      return this.isChecked;
    }

    setChildChecked(value) {
      this.childNodes.forEach(node => node.isChecked = value);
    }
    /**
     * Traverse upward
     * @param {Function} callback( node:TreeNode ) if returns true then stop each, else not stop
     */


    upwardEach(callback, {
      isSkipSelf = true
    } = {}) {
      let current = isSkipSelf ? this.parent : this;

      while (current) {
        if (callback(current)) {
          return;
        }

        current = current.parent;
      }
    }
    /**
     * from current node start, down each
     * @param {Function} callback( node:TreeNode, parentNode:TreeNode, deep: number) if returns true then stop each, else not stop
     */


    depthEach(upToDownCallBack = () => false, downToUpCallBack = () => false) {
      const dfs = (node, deep) => {
        if (!TreeNode.isType(node)) {
          return;
        }

        for (let i = 0; i < node.childNodes.length; i++) {
          const _node = node.childNodes[i];
          if (upToDownCallBack(_node, node, deep)) return;
          dfs(_node, deep + 1);
          if (downToUpCallBack(_node, node, deep)) return;
        }
      };

      upToDownCallBack(this, this.parent, 0);
      dfs(this, 1);
      downToUpCallBack(this, this.parent, 0);
    }

    getCheckedNode() {
      return this.childNodes.filter(item => item.isChecked);
    }
    /**
     *
     * @param {number} state 0:not checked, 1:checked, 2:indeterminate
     */


    setCheckedState(state) {
      const eunmState = [{
        isChecked: false,
        isIndeterminate: false
      }, {
        isChecked: true,
        isIndeterminate: false
      }, {
        isChecked: true,
        isIndeterminate: true
      }];

      if (!eunmState[state]) {
        return false;
      }

      this.isChecked = eunmState[state].isChecked;
      this.isIndeterminate = eunmState[state].isIndeterminate;
      return true;
    }
    /**
     * Look for node in the subtree
     * @param {ID|TreeNode} target
     */


    findOne(target) {
      let res = null;
      this.depthEach(node => {
        if (node.id == target || node === target) {
          res = node;
          return true;
        }
      });
      return res;
    }
    /**
     * find nodes
     * @param {Function | string} target
     */


    findMany(target) {
      const res = [];
      this.depthEach((node, parent, deep) => {
        if (typeof target === 'function' && target(node, parent, deep) || typeof target === 'string' && node.label.search(target) !== -1) {
          res.push(node);
        }
      });
      return res;
    }

    findChildIndex(target) {
      for (let i = 0; i < this.childNodes.length; i++) {
        const node = this.childNodes[i];

        if (node.id == target || node === target) {
          return i;
        }
      }

      return -1;
    }

    expand(value, ...extraNodes) {
      let _value = this.isExpanded;
      _value = typeof value === 'undefined' ? !_value : value;
      this.isExpanded = _value;
      this.upwardEach(node => {
        node.expand(true);
      });
      this.loadAsync();
      this.append(...extraNodes);
      this.isRendered = true;
    }

    filter(callback = () => true) {
      const arr = [];
      this.setSubTreeVisable(false);
      this.depthEach((node, parentNode, deep) => {
        const isShow = callback(node, parentNode, deep);

        if (isShow) {
          node.setVsiable(true);
          arr.push(node);
        }
      });
      return arr;
    }

    setSubTreeVisable(value) {
      this.depthEach(node => {
        node.isVisable = value;
      });
    }

    setVsiable(value) {
      this.isVisable = value;
      this.upwardEach(node => {
        node.isVisable = true;
      });
    }

    separation() {
      const parent = this.parent;
      if (!parent) return null;
      parent.removeChild(this.index);
      this.parent = null;
      return this;
    }
    /**
     * is allow move to target
     * @param {TreeNode} target
     * @param {string} relative top, bottom, inner
     */


    isAllowMove(target) {
      if (target === this) {
        return false;
      }

      if (this.findOne(target)) {
        return false;
      }

      return true;
    }
    /**
     * currentNode move to targetNode relative location
     * @param {TreeNode} target
     * @param {string} relative top, bottom, inner
     */


    move(target, relative) {
      if (!this.isAllowMove(target, relative)) {
        return false;
      }

      this.separation();

      switch (relative) {
        case 'top':
          // top
          target.parent.insertChild(target.index, this);
          return true;

        case 'inner':
          // inner
          target.expand(true, this);
          return true;

        case 'bottom':
          // bottom
          target.parent.insertChild(target.index + 1, this);
          return true;
      }
    }

    collapse() {
      const parent = this.parent;

      if (!parent) {
        return;
      }

      parent.childNodes.forEach(node => {
        if (node === this) {
          node.expand();
        } else {
          node.expand(false);
        }
      });
    }

    static isType(node) {
      if (typeof node !== 'object') {
        return false;
      }

      return node.type === typeFlag;
    }

    static create({
      id,
      label,
      childNodes,
      interceptHandler,
      ...otherParams
    }) {
      return new TreeNode(id, label, childNodes, otherParams, interceptHandler);
    }

  }

  /**
   * Deep traversal of the object
   * @param {object} target
   * @param {function} callback(cloneRawNode, rawNode, isLeaf)
   */

  function nodeMap(target, callback = () => null, {
    childKey = 'children',
    mapChildKey = 'children'
  } = {
    /* TreeNode */
  }) {
    const dfs = node => {
      if (isObject$2(node) && !isArray(node[childKey])) {
        const _cloneNode = { ...node
        };
        return callback(_cloneNode, node, true);
      }

      const cloneNode = { ...node
      };
      const newNode = callback(cloneNode, node, false);
      if (typeof newNode[childKey] !== 'undefined') delete newNode[childKey];
      newNode[mapChildKey] = [];

      for (let i = 0; i < node[childKey].length; i++) {
        const _node = node[childKey][i];
        const ret = dfs(_node);
        ret.parent = newNode;
        newNode[mapChildKey].push(ret);
      }

      return newNode;
    };

    return dfs(target);
  }
  function nodeEach(target, callback = () => false, {
    childKey = 'children',
    root = null
  } = {}) {
    const dfs = node => {
      if (!isObject$2(node) || isArray(node)) {
        return;
      }

      const child = node[childKey] || [];

      for (let i = 0; i < child.length; i++) {
        const _node = child[i];
        if (callback(_node
        /* Current */
        , node
        /* Parent */
        )) return;
        dfs(_node);
      }
    };

    if (callback(target
    /* Current */
    , root
    /* Parent */
    )) return;
    return dfs(target);
  }
  /**
   * Modify the property name of the object
   * @param {object} obj
   * @param {object} keyMap newKey mapping oldKey
   */

  function transitionObjectKey(obj, keyMap = {}) {
    const transitionKeyList = Object.keys(keyMap);
    transitionKeyList.forEach(key => {
      if (key !== keyMap[key]) {
        obj[key] = obj[keyMap[key]];
        delete obj[keyMap[key]];
      }
    });
    return obj;
  }
  const extractMethods = (obj, methods) => {
    const methodList = {};
    methods.forEach(method => {
      methodList[method] = obj[method].bind(obj);
    });
    return methodList;
  };

  function createAction(tree) {
    // this.root changed update this.raw
    const appendChild = function (node) {
      if (TreeNode.isType(node)) {
        tree.appendRawNode(this, node.data.raw); // 这里的this表示当前的TreeNode

        return [node];
      }

      tree.appendRawNode(this, node);
      return [tree.rawNodeToTreeNode(node)];
    };

    const removeChild = function (index) {
      tree.removeChildRawNode(this, index); // 这里的this表示当前的TreeNode
    };

    const insertChild = function (index, node) {
      if (TreeNode.isType(node)) {
        tree.insertRawNode(this, index, node.data.raw); // 这里的this表示当前的TreeNode

        return [index, node];
      }

      tree.insertRawNode(this, index, node);
      return [index, tree.rawNodeToTreeNode(node)];
    };

    return {
      appendChild,
      removeChild,
      insertChild
    };
  }

  class Tree {
    /**
     *
     * @param {object[]} list
     * @param {object} defaultNodeKey The incoming Node proprtry name maps to the default name
     */
    constructor(list, defaultNodeKey = {}, defaultNodeValue = {}) {
      this.isUpdateRaw = true;
      this.raw = list;
      this.injectAction = createAction(this); // The core method is injected with interceptor functions, the insert RowNode is automatically converted to TreeNode

      this.root = new TreeNode(Date.now(), 'root', [], defaultNodeValue, this.injectAction);
      this.defaultNodeKey = Object.assign({
        id: 'id',
        label: 'label',
        childNodes: 'childNodes',
        isDisabled: 'isDisabled',
        isAsync: 'isAsync',
        isChecked: 'isChecked',
        isVisable: 'isVisable',
        isExpanded: 'isExpanded'
      }, defaultNodeKey);
      this.defaultNodeValue = Object.assign({}, defaultNodeValue); // this.checked = []
      // this.expanded = []

      this.initRoot();
    }

    get isEmpty() {
      for (let i = 0; i < this.root.childNodes.length; i++) {
        const node = this.root.childNodes[i];

        if (node.isVisable) {
          return false;
        }
      }

      return true;
    }

    get checked() {
      const t = {};
      this.root.depthEach(node => {
        node.isChecked && !node.isIndeterminate && (t[node.id] = true);
      });
      return Object.keys(t);
    }

    set checked(v) {
      this.setCheckedByIdList(v);
    }

    get expanded() {
      const t = {};
      this.root.depthEach(node => {
        node.isExpanded && (t[node.id] = true);
      });
      return Object.keys(t);
    }

    set expanded(v) {
      this.setExpandedByIdList(v, true);
    }

    initRoot() {
      // rekeyname and create TreeNode
      this.isUpdateRaw = false;
      this.root.childNodes = [];
      this.root.append(...this.raw);
      this.isUpdateRaw = true;
    }

    rawNodeToTreeNode(rawNode) {
      const {
        childNodes
      } = this.defaultNodeKey;
      return nodeMap(rawNode, (_node, node) => {
        const handledNode = transitionObjectKey(_node, this.defaultNodeKey); // debugger

        const treeNode = TreeNode.create(Object.assign({}, this.defaultNodeValue, {
          data: {
            raw: node
          },
          interceptHandler: this.injectAction
        }, handledNode, {
          childNodes: []
        }));
        return treeNode;
      }, {
        childKey: childNodes,
        mapChildKey: 'childNodes'
      });
    }

    update() {
      // rebuild tree
      // TODO: 这里可以做diff优化
      this.initRoot();
    }

    removeChildRawNode(target, index) {
      const {
        childNodes
      } = this.defaultNodeKey;

      if (!this.isUpdateRaw) {
        return;
      }

      let rawChild = target.data.raw ? target.data.raw[childNodes] : this.raw;

      if (!rawChild) {
        target.data.raw[childNodes] = [];
        rawChild = target.data.raw[childNodes];
      }

      rawChild.splice(index, 1);
    }

    appendRawNode(target, rawNode) {
      const {
        childNodes
      } = this.defaultNodeKey;

      if (!this.isUpdateRaw) {
        return;
      }

      let rawChild = target.data.raw ? target.data.raw[childNodes] : this.raw;

      if (!rawChild) {
        target.data.raw[childNodes] = [];
        rawChild = target.data.raw[childNodes];
      }

      rawChild.push(rawNode);
    }

    insertRawNode(target, index, rawNode) {
      const {
        childNodes
      } = this.defaultNodeKey;

      if (!this.isUpdateRaw) {
        return;
      }

      let rawChild = target.data.raw ? target.data.raw[childNodes] : this.raw;

      if (!rawChild) {
        target.data.raw[childNodes] = [];
        rawChild = target.data.raw[childNodes];
      }

      rawChild.splice(index, 0, rawNode);
    }

    getParentRawNode(rawNode) {
      let parentNode = null;
      const {
        childNodes
      } = this.defaultNodeKey;
      nodeEach({
        [childNodes]: this.raw
      }, (current, parent) => {
        if (current === rawNode || current.id === rawNode.id) {
          parentNode = parent;
          return true;
        }
      }, {
        childKey: childNodes
      });
      return parentNode;
    }

    showAll() {
      this.root.setSubTreeVisable(true);
    }

    checkedAll() {
      this.root.setChecked(true);
    }

    expandAll() {
      this.root.depthEach(node => {
        if (node.isLeaf) {
          node.expand(true);
        }
      });
    }

    setCheckedByIdList(idList = []) {
      console.log(idList.toString());
      this.root.depthEach(node => {
        if (node === this.root) {
          return;
        }

        if (idList.indexOf(node.id) !== -1) {
          node.isChecked = true;
        }
      });
    }

    setExpandedByIdList(idList = [], value = true) {
      this.root.depthEach(node => {
        if (idList.indexOf(node.id) !== -1) {
          node.expand(value);
        }
      });
    }

  }

  var script$M = {
    name: 'ElNodeContent',
    props: {
      node: {
        required: true,
        type: TreeNode
      }
    },

    render(ctx) {
      const elTree = vue.inject('elTree');

      if (typeof elTree.slots.default === 'function') {
        return elTree.slots.default({
          node: ctx.node,
          data: ctx.node.data.raw
        });
      } else if (typeof elTree.props.renderContent === 'function') {
        return elTree.props.renderContent({
          node: ctx.node,
          data: ctx.node.data.raw
        });
      }

      return vue.h('span', ctx.node.label);
    }

  };

  script$M.__file = "packages/tree/NodeContent.vue";

  var script$L = {
    name: 'ElTreeNode',
    props: {
      node: TreeNode
    },
    components: {
      ElCollapseTransition,
      ElCheckbox: script$1o,
      ElNodeContent: script$M
    },

    setup(props) {
      const elTree = vue.inject('elTree');

      const onClickNode = e => {
        !elTree.props.expandOnClickNode || props.node.isLeaf || (elTree.props.accordion ? props.node.collapse() : props.node.expand());
        !elTree.props.checkOnClickNode || props.node.setChecked(undefined, elTree.props.checkStrictly);
        elTree.emit('node-click', props.node, e);
        elTree.emit('current-change', props.node, e);
        props.node.isExpanded ? elTree.emit('node-expand', props.node, e) : elTree.emit('node-collapse', props.node, e);
      };

      const onRightEvent = e => {
        if (!elTree.vnode.props['onNode-contextmenu']) return;
        e.preventDefault();
        elTree.emit('node-contextmenu', props.node, e);
      };

      const onChangeCheckbox = e => {
        props.node.setChecked(undefined, elTree.props.checkStrictly);
        elTree.emit('check-change', props.node, e);
      };

      return {
        elTree,
        onClickNode,
        onRightEvent,
        onChangeCheckbox
      };
    }

  };

  const _hoisted_1$x = {
    key: 1,
    class: "el-tree-node__loading-icon el-icon-loading"
  };
  function render$F(_ctx, _cache, $props, $setup, $data, $options) {
    const _component_el_checkbox = vue.resolveComponent("el-checkbox");

    const _component_el_node_content = vue.resolveComponent("el-node-content");

    const _component_el_tree_node = vue.resolveComponent("el-tree-node");

    const _component_el_collapse_transition = vue.resolveComponent("el-collapse-transition");

    return vue.withDirectives((vue.openBlock(), vue.createBlock("div", {
      class: ["el-tree-node", {
        'is-expanded': $props.node.isExpanded,
        'is-current': $setup.elTree.proxy.dragState.current === $props.node,
        'is-hidden': !$props.node.isVisable,
        'is-focusable': !$props.node.isDisabled,
        'is-checked': $props.node.isChecked,
        'is-drop-inner': $setup.elTree.proxy.dragState.drop === 'inner' && $setup.elTree.proxy.dragState.current === $props.node
      }],
      role: "TreeNode",
      tabindex: "-1",
      ref: "TreeNode",
      id: 'TreeNode' + $props.node.id,
      "aria-expanded": $props.node.isExpanded,
      "aria-disabled": $props.node.isDisabled,
      "aria-checked": $props.node.isChecked,
      draggable: $setup.elTree.props.draggable || $props.node.isDraggable,
      "data-node-id": $props.node.id,
      onContextmenu: _cache[3] || (_cache[3] = vue.withModifiers((...args) => $setup.onRightEvent && $setup.onRightEvent(...args), ["right", "stop"])),
      onClick: _cache[4] || (_cache[4] = vue.withModifiers((...args) => $setup.onClickNode && $setup.onClickNode(...args), ["stop"])),
      onDragstart: _cache[5] || (_cache[5] = vue.withModifiers($event => $setup.elTree.proxy.handleDragStart($props.node, $event), ["stop"])),
      onDragover: _cache[6] || (_cache[6] = vue.withModifiers($event => $setup.elTree.proxy.handleDragOver($props.node, $event), ["stop"])),
      onDragend: _cache[7] || (_cache[7] = vue.withModifiers($event => $setup.elTree.proxy.handleDragEnd($props.node, $event), ["stop"])),
      onDrop: _cache[8] || (_cache[8] = vue.withModifiers($event => $setup.elTree.proxy.handleDrop($props.node, $event), ["stop"]))
    }, [vue.createVNode("div", {
      class: "el-tree-node__content",
      style: {
        'padding-left': ($props.node.level - 1) * $setup.elTree.props.indent + 'px'
      }
    }, [vue.createVNode("span", {
      class: [{
        expanded: $props.node.isExpanded,
        'is-leaf': $props.node.isLeaf
      }, 'el-tree-node__expand-icon', $setup.elTree.props.iconClass],
      onClick: _cache[1] || (_cache[1] = vue.withModifiers($event => $props.node.isLeaf || ($setup.elTree.props.accordion ? $props.node.collapse() : $props.node.expand()), ["stop"]))
    }, null, 2
    /* CLASS */
    ), $setup.elTree.props.showCheckbox ? (vue.openBlock(), vue.createBlock(_component_el_checkbox, {
      key: 0,
      modelValue: $props.node.isChecked,
      indeterminate: $props.node.isIndeterminate,
      disabled: $props.node.isDisabled,
      "onUpdate:modelValue": $setup.onChangeCheckbox,
      onClick: _cache[2] || (_cache[2] = $event => $setup.elTree.emit('check', $props.node, $props.node.isChecked, $event))
    }, null, 8
    /* PROPS */
    , ["modelValue", "indeterminate", "disabled", "onUpdate:modelValue"])) : vue.createCommentVNode("v-if", true), $props.node.asyncState === 'loading' ? (vue.openBlock(), vue.createBlock("span", _hoisted_1$x)) : vue.createCommentVNode("v-if", true), vue.createVNode(_component_el_node_content, {
      class: "el-tree-node__label",
      node: $props.node
    }, null, 8
    /* PROPS */
    , ["node"])], 4
    /* STYLE */
    ), vue.createVNode(_component_el_collapse_transition, null, {
      default: vue.withCtx(() => [!$setup.elTree.props.renderAfterExpand || $props.node.isRendered ? vue.withDirectives((vue.openBlock(), vue.createBlock("div", {
        key: 0,
        class: "el-tree-node__children",
        role: "group",
        "aria-expanded": $props.node.isExpanded
      }, [(vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList($props.node.childNodes, child => {
        return vue.openBlock(), vue.createBlock(_component_el_tree_node, {
          key: child.id,
          node: child
        }, null, 8
        /* PROPS */
        , ["node"]);
      }), 128
      /* KEYED_FRAGMENT */
      ))], 8
      /* PROPS */
      , ["aria-expanded"])), [[vue.vShow, $props.node.isExpanded]]) : vue.createCommentVNode("v-if", true)]),
      _: 1
      /* STABLE */

    })], 42
    /* CLASS, PROPS, HYDRATE_EVENTS */
    , ["id", "aria-expanded", "aria-disabled", "aria-checked", "draggable", "data-node-id"])), [[vue.vShow, $props.node.isVisable]]);
  }

  script$L.render = render$F;
  script$L.__file = "packages/tree/TreeNode.vue";

  var script$K = {
    name: 'ElTree',
    components: {
      ElTreeNode: script$L
    },
    props: {
      data: {
        type: Array,
        default: () => []
      },
      emptyText: {
        type: String,
        default: () => t('el.tree.emptyText')
      },
      renderAfterExpand: {
        type: Boolean,
        default: true
      },
      checkStrictly: Boolean,
      defaultExpandAll: Boolean,
      expandOnClickNode: {
        type: Boolean,
        default: true
      },
      checkOnClickNode: Boolean,
      checkDescendants: {
        type: Boolean,
        default: false
      },
      checked: Array
      /* model */
      ,
      expanded: Array
      /* model */
      ,
      currentNodeKey: [String, Number],
      renderContent: Function,
      showCheckbox: {
        type: Boolean,
        default: false
      },
      draggable: {
        type: Boolean,
        default: false
      },
      allowDrag: Function,
      allowDrop: Function,
      defaultNodeKey: {
        type: Object,
        default: () => ({
          id: 'id',
          label: 'label',
          childNodes: 'childNodes',
          isDisabled: 'isDisabled',
          isAsync: 'isAsync',
          isChecked: 'isChecked',
          isVisable: 'isVisable',
          isExpanded: 'isExpanded',
          isLeaf: 'isLeaf'
        })
      },
      // {treeNodeKey : rawNodeKey}
      highlightCurrent: Boolean,
      accordion: Boolean,
      indent: {
        type: Number,
        default: 18
      },
      iconClass: {
        type: String,
        default: 'el-icon-caret-right'
      },
      async: {
        type: Boolean,
        default: false
      },
      asyncLoadFn: Function,
      showRootNode: Boolean
    },
    emits: ['node-click', 'node-contextmenu', 'check-change', 'check', 'current-change', 'node-expand', 'node-collapse', 'node-drag-start', 'node-drag-enter', 'node-drag-leave', 'node-drag-over', 'node-drag-end', 'node-drop', 'update:checked', 'update:expanded'],

    setup(props) {
      const instance = vue.getCurrentInstance();
      const tree = new Tree(props.data, props.defaultNodeKey, {
        asyncLoadFn: props.asyncLoadFn,
        isAsync: props.async
      });
      const state = vue.reactive({
        tree
      });
      vue.provide('elTree', instance);
      useTab();
      useExpand(props, state);
      useCheckbox(props, state);
      useFocusNode(props);
      const {
        handleKeydown
      } = useKeyDown();
      const drag = useDrag(props);
      return { ...drag,
        ...vue.toRefs(state),
        ...extractMethods(state.tree.root, ['append', 'remove', 'insert', 'removeChild', 'setChecked', 'setChildChecked', 'upwardEach', 'depthEach', 'findOne', 'findMany', 'findChildIndex', 'expand', 'setVsiable', 'move', 'filter']),
        ...extractMethods(state.tree, ['initRoot', 'getParentRawNode', 'showAll', 'checkedAll', 'expandAll']),
        tree: state.tree,
        root: state.tree.root,
        handleKeydown
      };
    }

  };

  function useCheckbox(props, state) {
    const instance = vue.getCurrentInstance();
    const {
      emit
    } = instance;
    vue.watchEffect(() => {
      if (props.checked) state.tree.setCheckedByIdList(props.checked);
    });
    vue.watchEffect(() => {
      emit('update:checked', state.tree.checked);
    });
  }

  function useExpand(props, state) {
    const instance = vue.getCurrentInstance();
    const {
      emit
    } = instance;

    if (props.defaultExpandAll) {
      state.tree.expandAll();
    }

    vue.watchEffect(() => {
      emit('update:expanded', state.tree.expanded);
    });
    vue.watchEffect(() => {
      state.tree.setExpandedByIdList(props.expanded, true);
    });
    vue.onMounted(() => {
      state.tree.root.expand(true);
    });
  }

  function useTab() {
    const instance = vue.getCurrentInstance();
    const {
      proxy
    } = instance;

    const initCheckbox = () => {
      const checkboxItems = proxy.$el.querySelectorAll('input[type=checkbox]');
      Array.prototype.forEach.call(checkboxItems, checkbox => {
        checkbox.setAttribute('tabindex', -1);
      });
    };

    const initTabIndex = () => {
      const treeItems = proxy.$el.querySelectorAll('.is-focusable[role=TreeItem]');
      const checkedItem = proxy.$el.querySelectorAll('.is-checked[role=TreeItem]');

      if (checkedItem.length) {
        checkedItem[0].setAttribute('tabindex', 0);
        return;
      }

      treeItems[0] && treeItems[0].setAttribute('tabindex', 0);
    };

    vue.onMounted(initTabIndex);
    vue.onUpdated(initCheckbox);
  }

  function useKeyDown() {
    const instance = vue.getCurrentInstance();
    const {
      proxy
    } = instance;

    const handleKeydown = ev => {
      const currentItem = ev.target;
      if (currentItem.className.indexOf('el-tree-node') === -1) return;
      const {
        key
      } = ev;
      const treeItems = proxy.$el.querySelectorAll('.is-focusable[role=TreeNode]');
      const treeItemArray = Array.prototype.slice.call(treeItems);
      const currentIndex = treeItemArray.indexOf(currentItem);
      let nextIndex;

      if (['ArrowUp', 'ArrowDown'].indexOf(key) > -1) {
        // up、down
        ev.preventDefault();

        if (key === 'ArrowUp') {
          // up
          nextIndex = currentIndex !== 0 ? currentIndex - 1 : 0;
        } else {
          nextIndex = currentIndex < treeItemArray.length - 1 ? currentIndex + 1 : 0;
        }

        treeItemArray[nextIndex].focus(); // 选中
      }

      if (['ArrowLeft', 'ArrowRight'].indexOf(key) > -1) {
        // left、right 展开
        currentItem.click(); // 选中

        ev.preventDefault();
      }

      const hasInput = currentItem.querySelector('[type="checkbox"]');

      if (['Enter', 'Space'].indexOf(key) > -1 && hasInput) {
        // space enter选中checkbox
        hasInput.click();
        ev.preventDefault();
      }
    };

    return {
      handleKeydown
    };
  }

  function useDrag(props) {
    const instance = vue.getCurrentInstance();
    const {
      emit
    } = instance;
    const dropIndicator = vue.ref();
    const dragState = vue.reactive({
      start: null
      /* TreeNode */
      ,
      current: null
      /* TreeNode */
      ,
      last: null
      /* TreeNode */
      ,
      drop: ''
      /* String => inner | top | bottom */

    });

    const handleDragStart = (node, e) => {
      if (typeof props.allowDrag === 'function' && !props.allowDrag(node, e)) {
        e.preventDefault();
        return false;
      }

      dragState.start = node;
      emit('node-drag-start', node, e);
    };

    const handleDragOver = (node, e) => {
      dragState.current = node;
      if (dragState.start === node) return;
      const margin = 7;
      const target = e.path.find(item => item.id === 'TreeNode' + node.id);
      const currentBound = target.getBoundingClientRect();
      const mourseY = e.clientY;

      if (currentBound.top + margin > mourseY) {
        dropIndicator.value.style.top = target.offsetTop + 'px';
        dropIndicator.value.style.left = node.level * props.indent + 'px';
        dragState.drop = 'top';
      } else if (currentBound.top + currentBound.height - margin < mourseY) {
        dropIndicator.value.style.top = target.offsetTop + currentBound.height + 'px';
        dropIndicator.value.style.left = node.level * props.indent + 'px';
        dragState.drop = 'bottom';
      } else {
        dragState.drop = 'inner';
        node.expand(true);
      } // wrap in try catch to address IE's error when first param is 'text/plain'
      // setData is required for draggable to work in FireFox
      // the content has to be '' so dragging a node out of the tree won't open a new tab in FireFox


      e && e.dataTransfer && isFunction$1(e.dataTransfer.setData) && e.dataTransfer.setData('text/plain', '');
      e.preventDefault();
      emit('node-drag-enter', dragState.start, node, e);
      emit('node-drag-over', dragState.start, node, e);
      emit('node-drag-leave', dragState.start, dragState.last, e);
      dragState.last = node;
    };

    const handleDragEnd = (node, e) => {
      dragState.current = null;
      emit('node-drag-end', dragState.start, node, e);
    };

    const handleDrop = (node, e) => {
      if (typeof props.allowDrog === 'function' && !props.allowDrog(dragState.start, node, dragState.drop, e)) {
        e.preventDefault();
        return false;
      }

      dragState.last = node;
      dragState.start.move(node, dragState.drop);
      emit('node-drop', dragState.start, node, e);
    };

    return {
      dragState,
      dropIndicator,
      handleDragStart,
      handleDragOver,
      handleDragEnd,
      handleDrop
    };
  }

  function useFocusNode(props) {
    vue.onMounted(() => {
      if (props.currentNodeKey) {
        const node = document.getElementById('TreeNode' + props.currentNodeKey);

        if (node) {
          node.focus();
        }
      }
    });
  }

  const _hoisted_1$w = {
    key: 2,
    class: "el-tree__empty-block"
  };
  const _hoisted_2$j = {
    class: "el-tree__empty-text"
  };
  const _hoisted_3$f = {
    class: "el-tree__drop-indicator",
    ref: "dropIndicator"
  };
  function render$E(_ctx, _cache, $props, $setup, $data, $options) {
    const _component_el_tree_node = vue.resolveComponent("el-tree-node");

    return vue.openBlock(), vue.createBlock("div", {
      class: ["el-tree", {
        'el-tree--highlight-current': $props.highlightCurrent
      }],
      role: "Tree",
      onKeydown: _cache[1] || (_cache[1] = (...args) => $setup.handleKeydown && $setup.handleKeydown(...args))
    }, [$props.showRootNode ? (vue.openBlock(), vue.createBlock(_component_el_tree_node, {
      node: $setup.tree.root,
      key: $setup.tree.root.id
    }, null, 8
    /* PROPS */
    , ["node"])) : (vue.openBlock(true), vue.createBlock(vue.Fragment, {
      key: 1
    }, vue.renderList($setup.tree.root.childNodes, child => {
      return vue.openBlock(), vue.createBlock(_component_el_tree_node, {
        node: child,
        key: child.id
      }, null, 8
      /* PROPS */
      , ["node"]);
    }), 128
    /* KEYED_FRAGMENT */
    )), $setup.tree.isEmpty ? (vue.openBlock(), vue.createBlock("div", _hoisted_1$w, [vue.createVNode("span", _hoisted_2$j, vue.toDisplayString($props.emptyText), 1
    /* TEXT */
    )])) : vue.createCommentVNode("v-if", true), vue.withDirectives(vue.createVNode("div", _hoisted_3$f, null, 512
    /* NEED_PATCH */
    ), [[vue.vShow, _ctx.dragState.current && (_ctx.dragState.drop === 'top' || _ctx.dragState.drop === 'bottom')]])], 34
    /* CLASS, HYDRATE_EVENTS */
    );
  }

  script$K.render = render$E;
  script$K.__file = "packages/tree/Tree.vue";

  /* istanbul ignore next */

  script$K.install = function (app) {
    app.component(script$K.name, script$K);
  };

  var script$J = {
    name: 'ElPager',
    props: {
      currentPage: {
        type: Number,
        default: 1
      },
      pageCount: {
        type: Number,
        default: 5
      },
      pagerCount: {
        type: Number,
        default: 7
      },
      disabled: {
        type: Boolean,
        default: false
      }
    },
    emits: ['update:currentPage'],

    setup(props, {
      emit
    }) {
      const {
        currentPage,
        pageCount,
        pagerCount,
        disabled
      } = vue.toRefs(props);
      const {
        quickClass,
        showMore,
        onMouseEnter
      } = useClass$1();
      const {
        pagers,
        onPagerClick
      } = usePager({
        currentPage,
        pageCount,
        pagerCount,
        showMore,
        disabled,
        emit
      });
      return {
        // state
        pagers,
        showMore,
        quickClass,
        // method
        onMouseEnter,
        onPagerClick
      };
    }

  };

  const useClass$1 = () => {
    const showMore = vue.reactive({
      left: false,
      right: false
    });
    const quickClass = vue.reactive({
      left: 'el-icon-more',
      right: 'el-icon-more'
    });
    vue.watch(showMore, v => {
      for (const vKey in v) {
        if (!v[vKey]) quickClass[vKey] = 'el-icon-more';
      }
    });

    const onMouseEnter = direction => {
      quickClass[direction] = `el-icon-d-arrow-${direction}`;
    };

    return {
      showMore,
      quickClass,
      onMouseEnter
    };
  };

  const usePager = ({
    currentPage,
    pageCount,
    pagerCount,
    showMore,
    disabled,
    emit
  }) => {
    const pagers = vue.computed(() => {
      const pagerValue = pagerCount.value;
      const halfPagerCount = (pagerValue - 1) / 2;
      const currentValue = Number(currentPage.value);
      const pageValue = Number(pageCount.value);
      let showPrevMore = false;
      let showNextMore = false;

      if (pageValue > pagerValue) {
        if (currentValue > pagerValue - halfPagerCount) showPrevMore = true;
        if (currentValue < pageValue - halfPagerCount) showNextMore = true;
      }

      const array = [];

      if (showPrevMore && !showNextMore) {
        const startPage = pageValue - (pagerValue - 2);

        for (let i = startPage; i < pageValue; i++) {
          array.push(i);
        }
      } else if (!showPrevMore && showNextMore) {
        for (let i = 2; i < pagerValue; i++) {
          array.push(i);
        }
      } else if (showPrevMore && showNextMore) {
        const offset = Math.floor(pagerValue / 2) - 1;

        for (let i = currentValue - offset; i <= currentValue + offset; i++) {
          array.push(i);
        }
      } else {
        for (let i = 2; i < pageValue; i++) {
          array.push(i);
        }
      }

      showMore.left = showPrevMore;
      showMore.right = showNextMore;
      return array;
    });

    const onPagerClick = event => {
      const target = event.target;

      if (target.tagName === 'UL' || disabled.value) {
        return;
      }

      let newPage = Number(event.target.textContent);
      const pagerCountOffset = pagerCount.value - 2;

      if (target.className.indexOf('more') !== -1) {
        if (target.className.indexOf('quickprev') !== -1) {
          newPage = currentPage.value - pagerCountOffset;
        } else if (target.className.indexOf('quicknext') !== -1) {
          newPage = +currentPage.value + pagerCountOffset;
        }
      }
      /* istanbul ignore if */


      if (!isNaN(newPage)) {
        if (newPage < 1) newPage = 1;
        if (newPage > pageCount.value) newPage = pageCount.value;
      }

      if (newPage !== currentPage.value) emit('update:currentPage', newPage);
    };

    return {
      pagers,
      onPagerClick
    };
  };

  function render$D(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("ul", {
      onClick: _cache[5] || (_cache[5] = (...args) => $setup.onPagerClick && $setup.onPagerClick(...args)),
      class: "el-pager"
    }, [$props.pageCount > 0 ? (vue.openBlock(), vue.createBlock("li", {
      key: 0,
      class: [{
        active: $props.currentPage === 1,
        disabled: $props.disabled
      }, "number"]
    }, " 1 ", 2
    /* CLASS */
    )) : vue.createCommentVNode("v-if", true), $setup.showMore.left ? (vue.openBlock(), vue.createBlock("li", {
      key: 1,
      class: ["el-icon more btn-quickprev", [$setup.quickClass.left, {
        disabled: $props.disabled
      }]],
      onMouseenter: _cache[1] || (_cache[1] = $event => $setup.onMouseEnter('left')),
      onMouseleave: _cache[2] || (_cache[2] = $event => $setup.quickClass.left = 'el-icon-more')
    }, null, 34
    /* CLASS, HYDRATE_EVENTS */
    )) : vue.createCommentVNode("v-if", true), (vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList($setup.pagers, pager => {
      return vue.openBlock(), vue.createBlock("li", {
        key: pager,
        class: [{
          active: $props.currentPage === pager,
          disabled: $props.disabled
        }, "number"]
      }, vue.toDisplayString(pager), 3
      /* TEXT, CLASS */
      );
    }), 128
    /* KEYED_FRAGMENT */
    )), $setup.showMore.right ? (vue.openBlock(), vue.createBlock("li", {
      key: 2,
      class: ["el-icon more btn-quicknext", [$setup.quickClass.right, {
        disabled: $props.disabled
      }]],
      onMouseenter: _cache[3] || (_cache[3] = $event => $setup.onMouseEnter('right')),
      onMouseleave: _cache[4] || (_cache[4] = $event => $setup.quickClass.right = 'el-icon-more')
    }, null, 34
    /* CLASS, HYDRATE_EVENTS */
    )) : vue.createCommentVNode("v-if", true), $props.pageCount > 1 ? (vue.openBlock(), vue.createBlock("li", {
      key: 3,
      class: [{
        active: $props.currentPage === $props.pageCount,
        disabled: $props.disabled
      }, "number"]
    }, vue.toDisplayString($props.pageCount), 3
    /* TEXT, CLASS */
    )) : vue.createCommentVNode("v-if", true)]);
  }

  script$J.render = render$D;
  script$J.__file = "packages/pagination/components/Pager.vue";

  var script$I = {
    name: 'Prev',
    props: {
      currentPage: {
        type: Number,
        default: 1
      },
      disabled: {
        type: Boolean,
        default: false
      },
      prevText: {
        type: String,
        default: ''
      },
      prev: Function
    },

    setup(props) {
      const isDisabled = vue.computed(() => props.disabled || props.currentPage <= 1);
      return { ...vue.toRefs(props),
        isDisabled
      };
    }

  };

  const _hoisted_1$v = {
    key: 0
  };
  const _hoisted_2$i = {
    key: 1,
    class: "el-icon el-icon-arrow-left"
  };
  function render$C(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("button", {
      type: "button",
      class: "btn-prev",
      disabled: $setup.isDisabled,
      onClick: _cache[1] || (_cache[1] = (...args) => $props.prev && $props.prev(...args))
    }, [$props.prevText ? (vue.openBlock(), vue.createBlock("span", _hoisted_1$v, vue.toDisplayString($props.prevText), 1
    /* TEXT */
    )) : (vue.openBlock(), vue.createBlock("i", _hoisted_2$i))], 8
    /* PROPS */
    , ["disabled"]);
  }

  script$I.render = render$C;
  script$I.__file = "packages/pagination/components/Prev.vue";

  var script$H = {
    name: 'Next',
    props: {
      currentPage: {
        type: Number,
        default: 1
      },
      pageCount: {
        type: Number,
        default: 1
      },
      disabled: {
        type: Boolean,
        default: false
      },
      nextText: {
        type: String,
        default: ''
      },
      next: Function
    },

    setup(props) {
      const isDisabled = vue.computed(() => props.disabled || props.currentPage === props.pageCount || props.pageCount === 0);
      return { ...vue.toRefs(props),
        isDisabled
      };
    }

  };

  const _hoisted_1$u = {
    key: 0
  };
  const _hoisted_2$h = {
    key: 1,
    class: "el-icon el-icon-arrow-right"
  };
  function render$B(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("button", {
      type: "button",
      class: "btn-next",
      disabled: $setup.isDisabled,
      onClick: _cache[1] || (_cache[1] = (...args) => $props.next && $props.next(...args))
    }, [$props.nextText ? (vue.openBlock(), vue.createBlock("span", _hoisted_1$u, vue.toDisplayString($props.nextText), 1
    /* TEXT */
    )) : (vue.openBlock(), vue.createBlock("i", _hoisted_2$h))], 8
    /* PROPS */
    , ["disabled"]);
  }

  script$H.render = render$B;
  script$H.__file = "packages/pagination/components/Next.vue";

  var script$G = {
    name: 'Jumper',
    components: {
      ElInput: script$1l
    },
    props: {
      currentPage: {
        type: Number,
        default: 1
      },
      pageCount: {
        type: Number,
        default: 5
      },
      disabled: {
        type: Boolean,
        default: false
      }
    },
    emits: ['change'],

    setup(props, {
      emit
    }) {
      const userInput = vue.ref(null);
      const {
        currentPage
      } = vue.toRefs(props);
      const t = useLocale();
      const showValue = vue.computed(() => {
        var _userInput$value;

        return (_userInput$value = userInput.value) !== null && _userInput$value !== void 0 ? _userInput$value : currentPage.value;
      });

      const handleInput = val => {
        userInput.value = val;
      };

      const handleChange = val => {
        emit('change', val);
        userInput.value = null;
      };

      return {
        // state
        showValue,
        // method
        t,
        handleInput,
        handleChange
      };
    }

  };

  const _hoisted_1$t = {
    class: "el-pagination__jump"
  };
  function render$A(_ctx, _cache, $props, $setup, $data, $options) {
    const _component_el_input = vue.resolveComponent("el-input");

    return vue.openBlock(), vue.createBlock("span", _hoisted_1$t, [vue.createTextVNode(vue.toDisplayString($setup.t('el.pagination.goto')) + " ", 1
    /* TEXT */
    ), vue.createVNode(_component_el_input, {
      class: "el-pagination__editor is-in-pagination",
      min: 1,
      max: $props.pageCount,
      modelValue: $setup.showValue,
      type: "number",
      disabled: $props.disabled,
      onInput: $setup.handleInput,
      onChange: $setup.handleChange
    }, null, 8
    /* PROPS */
    , ["max", "modelValue", "disabled", "onInput", "onChange"]), vue.createTextVNode(" " + vue.toDisplayString($setup.t('el.pagination.pageClassifier')), 1
    /* TEXT */
    )]);
  }

  script$G.render = render$A;
  script$G.__file = "packages/pagination/components/Jumper.vue";

  const Total = props => {
    return typeof props.total === 'number' ? vue.h('span', {
      class: 'el-pagination__total'
    }, useLocale()('el.pagination.total', {
      total: props.total
    })) : '';
  };

  var script$F = {
    name: 'Sizes',
    components: {
      ElSelect: script$1g,
      ElOption: script$1i
    },
    props: {
      pageSizes: Array,
      pageSize: Number,
      popperClass: String,
      handleChange: Function,
      disabled: Boolean,
      watchHandler: Function
    },

    setup(props) {
      const {
        popperClass,
        pageSizes
      } = vue.toRefs(props);
      const t = useLocale();
      const internalPopperClass = vue.computed(() => (popperClass === null || popperClass === void 0 ? void 0 : popperClass.value) || '');
      vue.watch(pageSizes, props.watchHandler);
      return { // state
        ...vue.toRefs(props),
        internalPopperClass,
        // methods
        t
      };
    }

  };

  const _hoisted_1$s = {
    class: "el-pagination__sizes"
  };
  function render$z(_ctx, _cache, $props, $setup, $data, $options) {
    const _component_el_option = vue.resolveComponent("el-option");

    const _component_el_select = vue.resolveComponent("el-select");

    return vue.openBlock(), vue.createBlock("span", _hoisted_1$s, [vue.createVNode(_component_el_select, {
      modelValue: $props.pageSize,
      popperClass: $setup.internalPopperClass,
      size: "mini",
      onChange: $props.handleChange,
      disabled: $props.disabled
    }, {
      default: vue.withCtx(() => [(vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList($props.pageSizes, item => {
        return vue.openBlock(), vue.createBlock(_component_el_option, {
          value: item,
          label: item + $setup.t('el.pagination.pagesize'),
          key: item
        }, null, 8
        /* PROPS */
        , ["value", "label"]);
      }), 128
      /* KEYED_FRAGMENT */
      ))]),
      _: 1
      /* STABLE */

    }, 8
    /* PROPS */
    , ["modelValue", "popperClass", "onChange", "disabled"])]);
  }

  script$F.render = render$z;
  script$F.__file = "packages/pagination/components/Sizes.vue";

  const useLayout = layout => {
    const template = [];
    const rightWrapper = [];
    const components = layout.split(',').map(item => item.trim());
    const findIndex = components.findIndex(item => item === '->');

    for (let i = 0; i < components.length; i++) {
      if (findIndex >= 0) {
        if (i === findIndex) continue;

        if (i < findIndex) {
          template.push(components[i]);
        } else {
          rightWrapper.push(components[i]);
        }
      } else {
        template.push(components[i]);
      }
    }

    return {
      template,
      rightWrapper
    };
  };

  const getValidCurrentPage = (value, pageCount) => {
    var _resetValue;

    value = parseInt(value, 10);
    const havePageCount = typeof pageCount === 'number';
    let resetValue;

    if (!havePageCount) {
      if (isNaN(value) || value < 1) resetValue = 1;
    } else {
      if (value < 1) {
        resetValue = 1;
      } else if (value > pageCount) {
        resetValue = pageCount;
      }
    }

    if (resetValue === undefined && isNaN(value) || resetValue === 0) {
      resetValue = 1;
    }

    return (_resetValue = resetValue) !== null && _resetValue !== void 0 ? _resetValue : value;
  };

  const useInternalCurrentPage = ({
    currentPage,
    emit,
    emitted
  }) => {
    const innerCurrentPage = vue.ref(null);
    return vue.computed({
      get() {
        var _ref, _innerCurrentPage$val;

        return (_ref = (_innerCurrentPage$val = innerCurrentPage.value) !== null && _innerCurrentPage$val !== void 0 ? _innerCurrentPage$val : currentPage === null || currentPage === void 0 ? void 0 : currentPage.value) !== null && _ref !== void 0 ? _ref : 1;
      },

      set(v) {
        emit('update:currentPage', v);
        emit('currentChange', v);

        if (currentPage) {
          vue.watch(currentPage, () => {
            emitted.value = true;
          });
        }

        if (emitted.value) innerCurrentPage.value = null;else innerCurrentPage.value = v;
        emitted.value = false;
      }

    });
  };

  const userInternalPageSize = ({
    pageSize,
    emit,
    emitted
  }) => {
    const innerPageSize = vue.ref(null);
    return vue.computed({
      get() {
        var _innerPageSize$value;

        return (_innerPageSize$value = innerPageSize.value) !== null && _innerPageSize$value !== void 0 ? _innerPageSize$value : pageSize.value;
      },

      set(v) {
        emit('update:pageSize', v);
        emit('sizeChange', v);
        innerPageSize.value = v;

        if (pageSize) {
          vue.watch(pageSize, () => {
            emitted.value = true;
          });
        }

        if (emitted.value) innerPageSize.value = null;
        emitted.value = false;
      }

    });
  };

  const useInternalPageCount = ({
    pageCount,
    total,
    pageSize
  }) => {
    const internalPageCount = vue.computed(() => {
      if (!total && !pageCount) return 5;

      if (typeof (total === null || total === void 0 ? void 0 : total.value) === 'number') {
        return Math.max(1, Math.ceil(total.value / pageSize.value));
      } else if (typeof (pageCount === null || pageCount === void 0 ? void 0 : pageCount.value) === 'number') {
        return Math.max(1, pageCount.value);
      } else {
        return 0;
      }
    });
    return {
      internalPageCount
    };
  };

  var ElPagination = {
    name: 'ElPagination',
    props: {
      pageSize: {
        type: Number,
        default: 10
      },
      small: Boolean,
      total: Number,
      pageCount: Number,
      pagerCount: {
        type: Number,

        validator(value) {
          return (value || 0) === value && value > 4 && value < 22 && value % 2 === 1;
        },

        default: 7
      },
      currentPage: {
        type: Number,
        default: 1
      },
      layout: {
        default: 'prev, pager, next, jumper, ->, total'
      },
      pageSizes: {
        type: Array,

        default() {
          return [10, 20, 30, 40, 50, 100];
        }

      },
      popperClass: String,
      prevText: String,
      nextText: String,
      background: Boolean,
      disabled: Boolean,
      hideOnSinglePage: Boolean
    },
    emits: ['update:currentPage', 'update:pageSize', 'currentChange', 'sizeChange', 'prevClick', 'nextClick'],

    setup(props, {
      emit
    }) {
      const currentPageEmitted = vue.ref(false);
      const pageSizeEmitted = vue.ref(false);
      const {
        currentPage,
        total,
        pageCount,
        pageSize,
        disabled,
        pageSizes
      } = vue.toRefs(props);
      const internalCurrentPage = useInternalCurrentPage({
        currentPage,
        emit,
        emitted: currentPageEmitted
      });
      const internalPageSize = userInternalPageSize({
        pageSize,
        pageSizes,
        emit,
        emitted: pageSizeEmitted
      });
      const {
        internalPageCount
      } = useInternalPageCount({
        pageCount,
        total,
        pageSize: internalPageSize
      });
      return {
        // state
        internalCurrentPage,
        internalPageCount,
        internalPageSize,

        // methods
        prev() {
          if (disabled.value) return;
          internalCurrentPage.value = getValidCurrentPage(internalCurrentPage.value - 1, internalPageCount.value);
          emit('prevClick', internalCurrentPage.value);
        },

        next() {
          if (disabled.value) return;
          internalCurrentPage.value = getValidCurrentPage(internalCurrentPage.value + 1, internalPageCount.value);
          emit('nextClick', internalCurrentPage.value);
        },

        onUpdate(val) {
          internalCurrentPage.value = val;
        },

        handleChange(val) {
          internalCurrentPage.value = getValidCurrentPage(val, internalPageCount.value);
        },

        handleSizeChange(val) {
          if (val !== internalPageSize.value) {
            internalPageSize.value = val = parseInt(val, 10);
          }
        },

        watchHandler(newValue) {
          if (valueEquals(newValue, pageSizes.value)) return;

          if (Array.isArray(newValue)) {
            internalPageSize.value = newValue.indexOf(internalPageSize.value) > -1 ? internalPageSize.value : pageSizes.value[0];
          }
        }

      };
    },

    render() {
      var _this$$slots$default, _this$$slots;

      if (!this.layout || this.hideOnSinglePage && this.internalPageCount === 1) return '';
      const {
        template,
        rightWrapper
      } = useLayout(this.layout);
      const templateComponent = {
        prev: vue.createVNode(script$I, {
          "currentPage": this.internalCurrentPage,
          "disabled": this.disabled,
          "prevText": this.prevText,
          "prev": this.prev
        }, null),
        jumper: vue.createVNode(script$G, {
          "currentPage": this.internalCurrentPage,
          "pageCount": this.internalPageCount,
          "disabled": this.disabled,
          "onChange": this.handleChange
        }, null),
        pager: vue.createVNode(script$J, {
          "currentPage": this.internalCurrentPage,
          "onUpdate:currentPage": $event => this.internalCurrentPage = $event,
          "pageCount": this.internalPageCount,
          "disabled": this.disabled
        }, null),
        next: vue.createVNode(script$H, {
          "currentPage": this.internalCurrentPage,
          "pageCount": this.internalPageCount,
          "disabled": this.disabled,
          "nextText": this.nextText,
          "next": this.next
        }, null),
        sizes: vue.createVNode(script$F, {
          "pageSizes": this.pageSizes,
          "pageSize": this.internalPageSize,
          "popperClass": this.popperClass,
          "handleChange": this.handleSizeChange,
          "disabled": this.disabled,
          "watchHandler": this.watchHandler
        }, null),
        slot: vue.createVNode(vue.Fragment, null, [(_this$$slots$default = (_this$$slots = this.$slots).default) === null || _this$$slots$default === void 0 ? void 0 : _this$$slots$default.call(_this$$slots)]),
        total: vue.createVNode(Total, {
          "total": this.total
        }, null)
      };
      return vue.createVNode("div", {
        "class": ['el-pagination', {
          'is-background': this.background,
          'el-pagination--small': this.small
        }]
      }, [rightWrapper.length ? vue.createVNode("div", {
        "className": "el-pagination__rightwrapper"
      }, [rightWrapper.map(item => {
        const Comp = templateComponent[item];
        return vue.createVNode(Comp, null, null);
      })]) : '', template.map(item => {
        const Comp = templateComponent[item];
        return vue.createVNode(Comp, null, null);
      })]);
    }

  };

  /* istanbul ignore next */

  ElPagination.install = function (app) {
    app.component(ElPagination.name, ElPagination);
  };

  var script$E = vue.defineComponent({
    name: 'ElBadge',
    props: {
      value: [String, Number],
      max: Number,
      isDot: Boolean,
      hidden: Boolean,
      type: {
        type: String,
        default: 'danger',

        validator(val) {
          return ['primary', 'success', 'warning', 'info', 'danger'].includes(val);
        }

      }
    },

    setup(props) {
      const badgeNumber = useBadgeNumber(props);
      const isShow = useShow(props);
      return {
        badgeNumber,
        isShow
      };
    }

  });

  const useBadgeNumber = props => {
    return vue.computed(() => {
      if (!props.max || isString(props.value)) {
        return props.value;
      }

      if (props.value <= props.max) {
        return props.value;
      }

      return `${props.max}+`;
    });
  };

  const useShow = props => {
    return vue.computed(() => {
      if (props.hidden) {
        return false;
      }

      if (props.value == 0) {
        return false;
      }

      return true;
    });
  };

  const _hoisted_1$r = {
    class: "el-badge"
  };
  function render$y(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("div", _hoisted_1$r, [vue.renderSlot(_ctx.$slots, "default"), vue.createVNode(vue.Transition, {
      name: "el-zoom-in-center"
    }, {
      default: vue.withCtx(() => [_ctx.isShow ? (vue.openBlock(), vue.createBlock("sup", {
        key: 0,
        class: ["el-badge__content", ['el-badge__content--' + _ctx.type, {
          'is-fixed': _ctx.$slots.default,
          'is-dot': _ctx.isDot
        }]],
        textContent: vue.toDisplayString(_ctx.badgeNumber)
      }, null, 10
      /* CLASS, PROPS */
      , ["textContent"])) : vue.createCommentVNode("v-if", true)]),
      _: 1
      /* STABLE */

    })]);
  }

  script$E.render = render$y;
  script$E.__file = "src/components/Badge/src/Badge.vue";

  /* istanbul ignore next */

  script$E.install = function (app) {
    app.component(script$E.name, script$E);
  };

  const props$1 = {
    icon: {
      type: String
    },
    size: {
      type: [Number, String],
      default: 'large',

      validator(val) {
        if (isString(val)) {
          return ['large', 'medium', 'small'].includes(val);
        }

        return isNumber(val);
      }

    },
    shape: {
      type: String,
      default: 'circle',

      validator(val) {
        return ['circle', 'square'].includes(val);
      }

    },
    src: {
      type: String
    },
    alt: {
      type: String
    },
    srcSet: {
      type: String
    },
    fit: {
      type: String,
      default: 'cover'
    },
    error: {
      type: Function
    }
  };

  var script$D = vue.defineComponent({
    name: 'ElAvatar',
    props: props$1,

    setup(props) {
      const {
        size,
        shape,
        icon,
        error
      } = vue.toRefs(props);
      const style = useStyle(size);
      const isShow = vue.ref(true);
      const classes = useClass(size, shape, icon);

      const handleError = e => {
        const ret = error === null || error === void 0 ? void 0 : error.value(e);

        if (ret !== false) {
          isShow.value = false;
        }
      };

      return {
        style,
        isShow,
        classes,
        handleError
      };
    }

  });

  const useStyle = size => {
    if (!isNumber(size.value)) {
      return {};
    }

    return vue.computed(() => {
      return {
        lineHeight: `${size.value}px`,
        height: `${size.value}px`,
        width: `${size.value}px`
      };
    });
  };

  const useClass = (size, shape, icon) => {
    return vue.computed(() => {
      const classList = ['el-avatar'];

      if (isString(size.value)) {
        classList.push(`el-avatar--${size.value}`);
      }

      if (shape) {
        classList.push(`el-avatar--${shape.value}`);
      }

      if (icon) {
        classList.push('el-avatar--icon');
      }

      return classList;
    });
  };

  function render$x(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("span", {
      style: _ctx.style,
      class: _ctx.classes
    }, [_ctx.isShow && _ctx.src ? (vue.openBlock(), vue.createBlock("img", {
      key: 0,
      src: _ctx.src,
      alt: _ctx.alt,
      srcSet: _ctx.srcSet,
      onError: _cache[1] || (_cache[1] = (...args) => _ctx.handleError && _ctx.handleError(...args)),
      style: {
        'object-fit': _ctx.fit
      }
    }, null, 44
    /* STYLE, PROPS, HYDRATE_EVENTS */
    , ["src", "alt", "srcSet"])) : _ctx.icon ? (vue.openBlock(), vue.createBlock("i", {
      key: 1,
      class: _ctx.icon
    }, null, 2
    /* CLASS */
    )) : vue.renderSlot(_ctx.$slots, "default", {
      key: 2
    })], 6
    /* CLASS, STYLE */
    );
  }

  script$D.render = render$x;
  script$D.__file = "src/components/Avatar/src/Avatar.vue";

  /* istanbul ignore next */

  script$D.install = function (app) {
    app.component(script$D.name, script$D);
  };

  const TYPE_CLASSES_MAP = {
    success: 'el-icon-success',
    warning: 'el-icon-warning',
    error: 'el-icon-error'
  };
  var script$C = {
    name: 'ElAlert',
    props: {
      title: {
        type: String,
        default: ''
      },
      description: {
        type: String,
        default: ''
      },
      type: {
        type: String,
        default: 'info'
      },
      closable: {
        type: Boolean,
        default: true
      },
      closeText: {
        type: String,
        default: ''
      },
      showIcon: Boolean,
      center: Boolean,
      effect: {
        type: String,
        default: 'light',
        validator: function (value) {
          return ['light', 'dark'].indexOf(value) !== -1;
        }
      }
    },
    emits: ['close'],

    setup(props, {
      emit,
      slots
    }) {
      const {
        description,
        type
      } = vue.toRefs(props);
      const visible = vue.ref(true);

      const close = () => {
        visible.value = false;
        emit('close');
      };

      const typeClass = vue.computed(() => {
        return `el-alert--${type.value}`;
      });
      const iconClass = vue.computed(() => {
        return TYPE_CLASSES_MAP[type.value] || 'el-icon-info';
      });
      const isBigIcon = vue.computed(() => {
        return description.value || slots.default ? 'is-big' : '';
      });
      const isBoldTitle = vue.computed(() => {
        return description.value || slots.default ? 'is-bold' : '';
      });
      return {
        visible,
        typeClass,
        iconClass,
        isBigIcon,
        isBoldTitle,
        close
      };
    }

  };

  const _hoisted_1$q = {
    class: "el-alert__content"
  };
  const _hoisted_2$g = {
    key: 1,
    class: "el-alert__description"
  };
  const _hoisted_3$e = {
    key: 2,
    class: "el-alert__description"
  };
  function render$w(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock(vue.Transition, {
      name: "el-alert-fade"
    }, {
      default: vue.withCtx(() => [vue.withDirectives(vue.createVNode("div", {
        class: ["el-alert", [$setup.typeClass, $props.center ? 'is-center' : '', 'is-' + $props.effect]],
        role: "alert"
      }, [$props.showIcon ? (vue.openBlock(), vue.createBlock("i", {
        key: 0,
        class: ["el-alert__icon", [$setup.iconClass, $setup.isBigIcon]]
      }, null, 2
      /* CLASS */
      )) : vue.createCommentVNode("v-if", true), vue.createVNode("div", _hoisted_1$q, [$props.title || _ctx.$slots.title ? (vue.openBlock(), vue.createBlock("span", {
        key: 0,
        class: ["el-alert__title", [$setup.isBoldTitle]]
      }, [vue.renderSlot(_ctx.$slots, "title", {}, () => [vue.createTextVNode(vue.toDisplayString($props.title), 1
      /* TEXT */
      )])], 2
      /* CLASS */
      )) : vue.createCommentVNode("v-if", true), _ctx.$slots.default && !$props.description ? (vue.openBlock(), vue.createBlock("p", _hoisted_2$g, [vue.renderSlot(_ctx.$slots, "default")])) : vue.createCommentVNode("v-if", true), $props.description && !_ctx.$slots.default ? (vue.openBlock(), vue.createBlock("p", _hoisted_3$e, vue.toDisplayString($props.description), 1
      /* TEXT */
      )) : vue.createCommentVNode("v-if", true), vue.withDirectives(vue.createVNode("i", {
        class: ["el-alert__closebtn", {
          'is-customed': $props.closeText !== '',
          'el-icon-close': $props.closeText === ''
        }],
        onClick: _cache[1] || (_cache[1] = (...args) => $setup.close && $setup.close(...args))
      }, vue.toDisplayString($props.closeText), 3
      /* TEXT, CLASS */
      ), [[vue.vShow, $props.closable]])])], 2
      /* CLASS */
      ), [[vue.vShow, $setup.visible]])]),
      _: 1
      /* STABLE */

    });
  }

  script$C.render = render$w;
  script$C.__file = "packages/alert/Alert.vue";

  /* istanbul ignore next */

  script$C.install = function (app) {
    app.component(script$C.name, script$C);
  };

  var script$B = {
    inheritAttrs: false,
    props: {
      text: {
        type: String,
        default: null
      },
      spinner: {
        type: String,
        default: null
      },
      background: {
        type: String,
        default: null
      },
      fullscreen: {
        type: Boolean,
        default: true
      },
      visible: {
        type: Boolean,
        default: false
      },
      customClass: {
        type: String,
        default: ''
      }
    },

    setup(props, {
      emit
    }) {
      const handleAfterLeave = () => {
        // TODO 这里的 emit 修改会造成对 api 的更改
        // eslint-disable-next-line vue/custom-event-name-casing
        emit('afterLeave');
      };

      const internalVisible = vue.ref(props.visible);
      const internalText = vue.ref(props.text);

      const show = () => {
        internalVisible.value = true;
      };

      const close = () => {
        internalVisible.value = false;
      };

      const setText = text => {
        internalText.value = text;
      };

      return {
        internalVisible,
        internalText,
        handleAfterLeave,
        show,
        close,
        setText
      };
    }

  };

  const _hoisted_1$p = {
    class: "el-loading-spinner"
  };
  const _hoisted_2$f = {
    key: 0,
    class: "circular",
    viewBox: "25 25 50 50"
  };

  const _hoisted_3$d = /*#__PURE__*/vue.createVNode("circle", {
    class: "path",
    cx: "50",
    cy: "50",
    r: "20",
    fill: "none"
  }, null, -1
  /* HOISTED */
  );

  const _hoisted_4$9 = {
    key: 2,
    class: "el-loading-text"
  };
  function render$v(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock(vue.Transition, {
      name: "el-loading-fade",
      onAfterLeave: $setup.handleAfterLeave
    }, {
      default: vue.withCtx(() => [vue.withDirectives(vue.createVNode("div", {
        class: ["el-loading-mask", [$props.customClass, {
          'is-fullscreen': $props.fullscreen
        }]],
        style: {
          backgroundColor: $props.background || ''
        }
      }, [vue.createVNode("div", _hoisted_1$p, [!$props.spinner ? (vue.openBlock(), vue.createBlock("svg", _hoisted_2$f, [_hoisted_3$d])) : (vue.openBlock(), vue.createBlock("i", {
        key: 1,
        class: $props.spinner
      }, null, 2
      /* CLASS */
      )), $props.text ? (vue.openBlock(), vue.createBlock("p", _hoisted_4$9, vue.toDisplayString($setup.internalText), 1
      /* TEXT */
      )) : vue.createCommentVNode("v-if", true)])], 6
      /* CLASS, STYLE */
      ), [[vue.vShow, $setup.internalVisible]])]),
      _: 1
      /* STABLE */

    }, 8
    /* PROPS */
    , ["onAfterLeave"]);
  }

  script$B.render = render$v;
  script$B.__file = "packages/loading/Loading.vue";

  const MOUNT_COMPONENT_REF = 'el_component';
  const COMPONENT_CONTAINER_SYMBOL = Symbol('el_component_container');
  /**
   * 创建组件实例对象
   * 返回的实例和调用 getCurrentComponent() 返回的一致
   * @param {*} Component
   */

  function createComponent(Component, props, children) {
    const vnode = vue.h(Component, { ...props,
      ref: MOUNT_COMPONENT_REF
    }, children);
    const container = document.createElement('div');
    vnode[COMPONENT_CONTAINER_SYMBOL] = container;
    vue.render(vnode, container);
    return vnode.component;
  }
  /**
   * 销毁组件实例对象
   * @param {*} ComponnetInstance 通过createComponent方法得到的组件实例对象
   */

  function unmountComponent(ComponnetInstance) {
    vue.render(undefined, ComponnetInstance.vnode[COMPONENT_CONTAINER_SYMBOL]);
  }

  const addStyle = (options, parent, proxy) => {
    const maskStyle = {};

    if (options.fullscreen) {
      addClass(proxy.$el, 'is-fullscreen');
      proxy.originalPosition = getStyle(document.body, 'position');
      proxy.originalOverflow = getStyle(document.body, 'overflow');
      maskStyle.zIndex = PopupManager.nextZIndex();
    } else if (options.body) {
      removeClass(proxy.$el, 'is-fullscreen');
      proxy.originalPosition = getStyle(document.body, 'position');
      ['top', 'left'].forEach(property => {
        const scroll = property === 'top' ? 'scrollTop' : 'scrollLeft';
        maskStyle[property] = options.target.getBoundingClientRect()[property] + //         document.body[scroll] +
        document.documentElement[scroll] + 'px';
      });
      ['height', 'width'].forEach(property => {
        maskStyle[property] = options.target.getBoundingClientRect()[property] + 'px';
      });
    } else {
      proxy.originalPosition = getStyle(parent, 'position');
    }

    Object.keys(maskStyle).forEach(property => {
      proxy.$el.style[property] = maskStyle[property];
    });

    if (proxy.originalPosition !== 'absolute' && proxy.originalPosition !== 'fixed') {
      addClass(parent, 'el-loading-parent--relative');
    }

    if (options.fullscreen && options.lock) {
      addClass(parent, 'el-loading-parent--hidden');
    }
  };

  const defaults$2 = {
    target: null,
    body: false,
    fullscreen: true,
    lock: false,
    text: null,
    spinner: null,
    background: null,
    customClass: ''
  };

  const toggleLoading = (el, binding) => {
    if (binding.value) {
      vue.nextTick(() => {
        let parentEl = document.body;

        if (!binding.modifiers.fullscreen) {
          parentEl = el;
        }

        addStyle(el.options, parentEl, el.instance);
        el.instance.show();
        parentEl.appendChild(el.mask);
      });
    } else {
      el.instance.close();
    }
  };

  const loadingDirective = {
    mounted: function (el, binding, vnode) {
      const textExr = el.getAttribute('element-loading-text');
      const spinnerExr = el.getAttribute('element-loading-spinner');
      const backgroundExr = el.getAttribute('element-loading-background');
      const customClassExr = el.getAttribute('element-loading-custom-class');
      const vm = vnode.context;
      const options = merge({}, defaults$2, {
        text: vm && vm[textExr] || textExr,
        spinner: vm && vm[spinnerExr] || spinnerExr,
        background: vm && vm[backgroundExr] || backgroundExr,
        customClass: vm && vm[customClassExr] || customClassExr,
        fullscreen: !!binding.modifiers.fullscreen
      });
      const mask = createComponent(script$B, { ...options,

        onAfterLeave() {
          el.domVisible = false;
          const target = binding.modifiers.fullscreen || binding.modifiers.body ? document.body : el;
          removeClass(target, 'el-loading-parent--relative');
          removeClass(target, 'el-loading-parent--hidden');
        }

      });
      el.options = options;
      el.instance = mask.proxy;
      el.mask = mask.proxy.$el;
      el.maskStyle = {};
      binding.value && toggleLoading(el, binding);
    },
    updated: function (el, binding) {
      el.instance.setText(el.getAttribute('element-loading-text'));

      if (binding.oldValue !== binding.value) {
        toggleLoading(el, binding);
      }
    },
    unmounted: function () {// if (el.domInserted) {
      //   el.mask && el.mask.parentNode && el.mask.parentNode.removeChild(el.mask)
      //   toggleLoading(el, { value: false, modifiers: binding.modifiers })
      // }
      // el.instance && el.instance.close()
    }
  };
  var directive$1 = {
    install(app) {
      // if (Vue.prototype.$isServer) return
      app.directive('loading', loadingDirective);
    }

  };

  const defaults$1 = {
    target: null,
    body: false,
    fullscreen: true,
    lock: false,
    text: null,
    spinner: null,
    background: null,
    customClass: ''
  };
  let fullscreenLoading;

  const Loading = (options = {}) => {
    // if (Vue.prototype.$isServer) return
    options = merge({}, defaults$1, options);

    if (typeof options.target === 'string') {
      options.target = document.querySelector(options.target);
    }

    options.target = options.target || document.body;

    if (options.target !== document.body) {
      options.fullscreen = false;
    } else {
      options.body = true;
    }

    if (options.fullscreen && fullscreenLoading) {
      return fullscreenLoading;
    }

    const parent = options.body ? document.body : options.target;
    const instance = createComponent(script$B, { ...options,
      visible: true,

      onAfterLeave() {
        if (options.fullscreen) {
          fullscreenLoading = undefined;
        }

        const target = options.fullscreen || options.body ? document.body : options.target;
        removeClass(target, 'el-loading-parent--relative');
        removeClass(target, 'el-loading-parent--hidden');
        unmountComponent(instance);
      }

    });
    addStyle(options, parent, instance.proxy);
    parent.appendChild(instance.proxy.$el);

    if (options.fullscreen) {
      fullscreenLoading = instance;
    }

    instance.close = close;
    return instance;
  };

  const close = function () {
    this.proxy.close();
  };

  var ElLoading = {
    install(app) {
      app.use(directive$1);
    },

    service: Loading,
    directive: directive$1
  };

  var script$A = {
    props: {
      message: {
        type: [String, Object]
      },
      type: {
        type: String,
        defalut: 'info',

        validator(val) {
          return ['success', 'warning', 'info', 'error'].includes(val);
        }

      },
      iconClass: String,
      showClose: Boolean,
      duration: Number,
      center: Boolean,
      customClass: String,
      dangerouslyUseHTMLString: Boolean,
      offset: Number
    },
    emits: ['close'],

    setup(props, {
      emit
    }) {
      const instance = vue.getCurrentInstance();
      const isShow = vue.ref(true); // @public

      const offsetVal = vue.ref(props.offset);
      const isShowType = vue.computed(() => props.type && !props.iconClass);
      const positionStyle = vue.computed(() => ({
        top: `${offsetVal.value}px`
      }));
      let timer;

      function delayClose() {
        if (props.duration > 0) {
          timer = setTimeout(() => {
            _close();
          }, props.duration);
        }
      }

      function _close() {
        clearTimeout(timer);
        emit('close', instance);
        isShow.value = false;
      }

      function handleAfterLeave() {
        var _instance$vnode$el$pa;

        (_instance$vnode$el$pa = instance.vnode.el.parentElement) === null || _instance$vnode$el$pa === void 0 ? void 0 : _instance$vnode$el$pa.removeChild(instance.vnode.el);
      }

      function handleClose() {
        _close();
      }

      function handleMouseenter() {
        clearTimeout(timer);
      }

      function handleMouseleave() {
        delayClose();
      } // @public


      function close() {
        _close();
      }

      delayClose();
      return {
        close,
        isShow,
        isShowType,
        positionStyle,
        offsetVal,
        handleClose,
        handleAfterLeave,
        handleMouseenter,
        handleMouseleave
      };
    }

  };

  const _hoisted_1$o = {
    key: 1,
    class: "el-message__content"
  };
  function render$u(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock(vue.Transition, {
      name: "el-message-fade",
      onAfterLeave: $setup.handleAfterLeave,
      appear: ""
    }, {
      default: vue.withCtx(() => [vue.withDirectives(vue.createVNode("div", {
        class: ['el-message', $setup.isShowType ? `el-message--${$props.type}` : '', $props.showClose ? 'is-closable' : '', $props.center ? 'is-center' : '', $props.customClass],
        style: [$setup.positionStyle],
        onMouseenter: _cache[2] || (_cache[2] = (...args) => $setup.handleMouseenter && $setup.handleMouseenter(...args)),
        onMouseleave: _cache[3] || (_cache[3] = (...args) => $setup.handleMouseleave && $setup.handleMouseleave(...args))
      }, [$props.iconClass ? (vue.openBlock(), vue.createBlock("i", {
        key: 0,
        class: $props.iconClass
      }, null, 2
      /* CLASS */
      )) : (vue.openBlock(), vue.createBlock("i", {
        key: 1,
        class: ['el-message__icon', `el-icon-${$props.type}`]
      }, null, 2
      /* CLASS */
      )), vue.renderSlot(_ctx.$slots, "default", {}, () => [$props.dangerouslyUseHTMLString ? (vue.openBlock(), vue.createBlock("p", {
        key: 0,
        class: "el-message__content",
        innerHTML: $props.message
      }, null, 8
      /* PROPS */
      , ["innerHTML"])) : (vue.openBlock(), vue.createBlock("p", _hoisted_1$o, vue.toDisplayString($props.message), 1
      /* TEXT */
      ))]), $props.showClose ? (vue.openBlock(), vue.createBlock("i", {
        key: 2,
        class: "el-message__closeBtn el-icon-close",
        onClick: _cache[1] || (_cache[1] = (...args) => $setup.handleClose && $setup.handleClose(...args))
      })) : vue.createCommentVNode("v-if", true)], 38
      /* CLASS, STYLE, HYDRATE_EVENTS */
      ), [[vue.vShow, $setup.isShow]])]),
      _: 3
      /* FORWARDED */

    }, 8
    /* PROPS */
    , ["onAfterLeave"]);
  }

  script$A.render = render$u;
  script$A.__file = "src/components/Message/src/Message.vue";

  const instanceList$1 = [];
  function Message(opts) {
    return createMessage(mergeOptions(opts));
  }

  Message.closeAll = () => {
    instanceList$1.forEach(instance => {
      instance.proxy.close();
      removeInstance$1(instance);
    });
  };

  ['info', 'success', 'warning', 'error'].forEach(type => {
    Message[type] = opts => {
      return createMessage(mergeOptions(opts, type));
    };
  });

  function createMessage(opts) {
    const instance = createMessageComponentByOpts(opts);
    setZIndex$1(instance);
    appendToBody(instance);
    addInstance$1(instance);
    return instance.proxy;
  }

  function createMessageComponentByOpts(opts) {
    if (vue.isVNode(opts.message)) {
      return createComponent(script$A, opts, () => opts.message);
    }

    return createComponent(script$A, opts);
  }

  function setZIndex$1(instance) {
    instance.vnode.el.style.zIndex = PopupManager.nextZIndex();
  }

  function mergeOptions(opts, type = 'info') {
    const defaultOptions = {
      duration: 4500,
      type,
      offset: calculateVerticalOffset$1(opts.offset)
    };
    const userOnClose = opts === null || opts === void 0 ? void 0 : opts.onClose; // opts.onClose Cannot be merged into the default options

    opts === null || opts === void 0 ? true : delete opts.onClose;
    opts === null || opts === void 0 ? true : delete opts.offset;

    defaultOptions.onClose = instance => {
      closeMessage(instance);
      if (userOnClose) userOnClose(instance.proxy);
    };

    if (typeof opts === 'string' || vue.isVNode(opts)) {
      defaultOptions.message = opts;
      return defaultOptions;
    }

    return Object.assign({}, defaultOptions, opts);
  }

  function calculateVerticalOffset$1(offset = 20) {
    let result = offset;
    instanceList$1.forEach(instance => {
      result += getNextElementInterval(instance);
    });
    return result;
  }

  function closeMessage(instance) {
    updatePosition$1(instance);
    removeInstance$1(instance);
  }

  function updatePosition$1(closeInstance) {
    const currentInstanceIndex = getIndexByInstance$1(closeInstance);
    if (currentInstanceIndex < 0) return;

    for (let index = currentInstanceIndex + 1; index < instanceList$1.length; index++) {
      const instance = instanceList$1[index];
      instance.proxy.offsetVal -= getNextElementInterval(closeInstance);
    }
  }

  function getNextElementInterval(instance) {
    const INTERVAL_HEIGHT = 16;
    return instance.vnode.el.offsetHeight + INTERVAL_HEIGHT;
  }

  function addInstance$1(instance) {
    instanceList$1.push(instance);
  }

  function removeInstance$1(instance) {
    instanceList$1.splice(getIndexByInstance$1(instance), 1);
  }

  function getIndexByInstance$1(instance) {
    return instanceList$1.findIndex(i => i.uid == instance.uid);
  }

  function appendToBody(componentInstance) {
    document.body.append(componentInstance.vnode.el);
  }

  let idSeed = 1;
  let scrollBarWidth;
  const popupProps = {
    visible: {
      type: Boolean,
      default: false
    },
    openDelay: {},
    closeDelay: {},
    zIndex: {},
    modal: {
      type: Boolean,
      default: false
    },
    modalFade: {
      type: Boolean,
      default: true
    },
    modalClass: {},
    modalAppendToBody: {
      type: Boolean,
      default: false
    },
    lockScroll: {
      type: Boolean,
      default: true
    },
    closeOnPressEscape: {
      type: Boolean,
      default: false
    },
    closeOnClickModal: {
      type: Boolean,
      default: false
    }
  };

  function usePopup(props) {
    const {
      visible,
      modal,
      modalAppendToBody,
      lockScroll,
      closeDelay
    } = vue.toRefs(props);
    const opened = vue.ref(false);
    const bodyPaddingRight = vue.ref(null);
    const computedBodyPaddingRight = vue.ref(0);
    const withoutHiddenClass = vue.ref(true);
    const rendered = vue.ref(false);
    const instance = vue.getCurrentInstance();
    let _popupId = 0;
    let _closeTimer = 0;
    let _openTimer = 0;
    let _opening = false;
    let _closing = false;

    const open = options => {
      if (!rendered.value) {
        rendered.value = true;
      }

      const props = merge(instance.proxy, options);
      /**
       * fix bug (#577)
       */

      if (_closeTimer) {
        clearTimeout(_closeTimer);
        _closeTimer = 0;
      }

      clearTimeout(_openTimer);
      const delay = Number(props.openDelay) || 0;

      if (delay > 0) {
        _openTimer = setTimeout(() => {
          _openTimer = 0;
          doOpen(props);
        }, delay);
      } else {
        doOpen(props);
      }
    };

    const doOpen = props => {
      if (instance.proxy.$isServer) return;
      if (_opening) return;
      if (opened.value) return;
      _opening = true;
      const dom = instance.proxy.$el;
      const modal = props.modal;
      const zIndex = props.zIndex;

      if (zIndex) {
        PopupManager.zIndex = zIndex.value;
      }

      if (modal) {
        if (_closing) {
          PopupManager.closeModal(_popupId);
          _closing = false;
        }

        PopupManager.openModal(_popupId, PopupManager.nextZIndex(), modalAppendToBody.value ? undefined : dom, props.modalClass, props.modalFade);

        if (props.lockScroll) {
          withoutHiddenClass.value = !hasClass(document.body, 'el-popup-parent--hidden');

          if (withoutHiddenClass.value) {
            bodyPaddingRight.value = document.body.style.paddingRight;
            computedBodyPaddingRight.value = parseInt(getStyle(document.body, 'paddingRight'), 10);
          }

          scrollBarWidth = getScrollBarWidth();
          const bodyHasOverflow = document.documentElement.clientHeight < document.body.scrollHeight;
          const bodyOverflowY = getStyle(document.body, 'overflowY');

          if (scrollBarWidth > 0 && (bodyHasOverflow || bodyOverflowY === 'scroll') && withoutHiddenClass.value) {
            document.body.style.paddingRight = computedBodyPaddingRight.value + scrollBarWidth + 'px';
          }

          addClass(document.body, 'el-popup-parent--hidden');
        }
      }

      if (getComputedStyle(dom).position === 'static') {
        dom.style.position = 'absolute';
      }

      dom.style.zIndex = PopupManager.nextZIndex();
      opened.value = true;
      instance.onOpen && instance.onOpen();
      doAfterOpen();
    };

    const doAfterOpen = () => {
      _opening = false;
    };

    const close = () => {
      if (_closing) return;

      if (_openTimer) {
        clearTimeout(_openTimer);
        _openTimer = 0;
      }

      clearTimeout(_closeTimer);
      const delay = Number(closeDelay && closeDelay.value);

      if (delay > 0) {
        _closeTimer = setTimeout(() => {
          _closeTimer = 0;
          doClose();
        }, delay);
      } else {
        doClose();
      }
    };

    const doClose = () => {
      _closing = true;
      instance.onClose && instance.onClose();

      if (lockScroll.value) {
        setTimeout(restoreBodyStyle, 200);
      }

      opened.value = false;
      doAfterClose();
    };

    const doAfterClose = () => {
      PopupManager.closeModal(_popupId);
      _closing = false;
    };

    const restoreBodyStyle = () => {
      if (modal.value && withoutHiddenClass.value) {
        document.body.style.paddingRight = bodyPaddingRight.value;
        removeClass(document.body, 'el-popup-parent--hidden');
      }

      withoutHiddenClass.value = true;
    };

    vue.watch(visible, val => {
      if (val) {
        if (_opening) return;

        if (!rendered.value) {
          rendered.value = true;
          vue.nextTick(() => {
            open();
          });
        } else {
          open();
        }
      } else {
        close();
      }
    });
    vue.onBeforeMount(() => {
      _popupId = 'popup-' + idSeed++;
      PopupManager.register(_popupId, instance);
    });
    vue.onBeforeUnmount(() => {
      PopupManager.deregister(_popupId);
      PopupManager.closeModal(_popupId);
      restoreBodyStyle();
    });
    return {
      opened,
      visible,
      open,
      rendered,
      close
    };
  }

  /* eslint-disable no-use-before-define */
  /**
   * @constructor
   * @desc Dialog object providing modal focus management.
   *
   * Assumptions: The element serving as the dialog container is present in the
   * DOM and hidden. The dialog container has role='dialog'.
   *
   * @param dialogId
   *          The ID of the element serving as the dialog container.
   * @param focusAfterClosed
   *          Either the DOM node or the ID of the DOM node to focus when the
   *          dialog closes.
   * @param focusFirst
   *          Optional parameter containing either the DOM node or the ID of the
   *          DOM node to focus when the dialog opens. If not specified, the
   *          first focusable element in the dialog will receive focus.
   */

  var aria = aria || {};
  var tabEvent;

  aria.Dialog = function (dialog, focusAfterClosed, focusFirst) {
    this.dialogNode = dialog;

    if (this.dialogNode === null || this.dialogNode.getAttribute('role') !== 'dialog') {
      throw new Error('Dialog() requires a DOM element with ARIA role of dialog.');
    }

    if (typeof focusAfterClosed === 'string') {
      this.focusAfterClosed = document.getElementById(focusAfterClosed);
    } else if (typeof focusAfterClosed === 'object') {
      this.focusAfterClosed = focusAfterClosed;
    } else {
      this.focusAfterClosed = null;
    }

    if (typeof focusFirst === 'string') {
      this.focusFirst = document.getElementById(focusFirst);
    } else if (typeof focusFirst === 'object') {
      this.focusFirst = focusFirst;
    } else {
      this.focusFirst = null;
    }

    if (this.focusFirst) {
      this.focusFirst.focus();
    } else {
      Utils.focusFirstDescendant(this.dialogNode);
    }

    this.lastFocus = document.activeElement;

    tabEvent = e => {
      this.trapFocus(e);
    };

    this.addListeners();
  };

  aria.Dialog.prototype.addListeners = function () {
    document.addEventListener('focus', tabEvent, true);
  };

  aria.Dialog.prototype.removeListeners = function () {
    document.removeEventListener('focus', tabEvent, true);
  };

  aria.Dialog.prototype.closeDialog = function () {
    this.removeListeners();

    if (this.focusAfterClosed) {
      setTimeout(() => {
        this.focusAfterClosed.focus();
      });
    }
  };

  aria.Dialog.prototype.trapFocus = function (event) {
    if (Utils.IgnoreUtilFocusChanges) {
      return;
    }

    if (this.dialogNode.contains(event.target)) {
      this.lastFocus = event.target;
    } else {
      Utils.focusFirstDescendant(this.dialogNode);

      if (this.lastFocus === document.activeElement) {
        Utils.focusLastDescendant(this.dialogNode);
      }

      this.lastFocus = document.activeElement;
    }
  };

  var Dialog = aria.Dialog;

  const typeMap = {
    success: 'success',
    info: 'info',
    warning: 'warning',
    error: 'error'
  };
  var script$z = {
    mixins: [Locale],
    props: { ...popupProps,
      modal: {
        type: Boolean,
        default: true
      },
      title: {
        type: String,
        default: null
      },
      message: {
        type: [Object, String],

        default() {
          return {};
        }

      },
      dangerouslyUseHTMLString: {
        type: Boolean,
        default: false
      },
      type: {
        type: String,
        default: 'info',

        validator(val) {
          return ['success', 'warning', 'info', 'error'].indexOf(val);
        }

      },
      iconClass: {
        type: String,
        default: null
      },
      customClass: {
        type: String,
        default: null
      },
      callback: {
        type: Function,
        default: () => {}
      },
      showClose: {
        type: Boolean,
        default: true
      },
      beforeClose: {
        type: Function,
        default: () => {}
      },
      distinguishCancelAndClose: {
        type: Boolean,
        default: false
      },
      lockScroll: {
        type: Boolean,
        default: true
      },
      showCancelButton: {
        type: Boolean,
        default: false
      },
      showConfirmButton: {
        type: Boolean,
        default: true
      },
      cancelButtonClass: {
        type: String,
        default: null
      },
      confirmButtonClass: {
        type: String,
        default: null
      },
      closeOnClickModal: {
        type: Boolean,
        default: true
      },
      closeOnPressEscape: {
        type: Boolean,
        default: true
      },
      closeOnHashChange: {
        type: Boolean,
        default: true
      },
      showInput: {
        type: Boolean,
        default: false
      },
      inputPlaceholder: {
        type: String,
        default: ''
      },
      inputType: {
        type: String,
        default: 'text'
      },
      inputValue: {
        type: String,
        default: ''
      },
      inputPattern: {
        type: RegExp,
        default: null
      },
      inputValidator: {
        type: Function,
        default: () => {}
      },
      inputErrorMessage: {
        type: String,
        default: ''
      },
      center: {
        type: Boolean,
        default: false
      },
      roundButton: {
        type: Boolean,
        default: false
      },
      _type: {
        type: String,
        default: ''
      },
      cancelButtonLoading: {
        type: Boolean,
        default: false
      }
    },
    components: {
      ElInput: script$1l,
      ElButton: script$1u
    },

    setup(props, {
      attrs
    }) {
      const confirmButtonText = vue.ref(attrs.confirmButtonText || '确认');
      const cancelButtonText = vue.ref(attrs.cancelButtonText || '取消');
      let messageBox = '';
      const instance = vue.getCurrentInstance();
      const {
        closeOnClickModal,
        distinguishCancelAndClose,
        _type,
        beforeClose,
        callback,
        type,
        iconClass,
        message,
        inputType,
        cancelButtonClass,
        confirmButtonClass,
        closeOnHashChange,
        lockScroll,
        inputPattern,
        inputValidator,
        inputValue
      } = vue.toRefs(props);
      const state = vue.reactive({
        visible: false,
        action: null,
        editorErrorMessage: null,
        uid: 0,
        inputValue: vue.unref(inputValue),
        isVnode: false
      });
      const {
        rendered,
        open,
        close,
        restoreBodyStyle
      } = usePopup({ ...vue.toRefs(props),
        visible: state.visible
      });

      const validate = () => {
        if (vue.unref(_type) === 'prompt') {
          const _inputPattern = vue.unref(inputPattern);

          if (_inputPattern && !_inputPattern.test(state.inputValue || '')) {
            state.editorErrorMessage = state.inputErrorMessage || t('el.messagebox.error');
            addClass(getInputElement(), 'invalid');
            return false;
          }

          const _inputValidator = vue.unref(inputValidator);

          if (typeof _inputValidator === 'function') {
            const validateResult = _inputValidator(state.inputValue);

            if (validateResult === false) {
              state.editorErrorMessage = state.inputErrorMessage || t('el.messagebox.error');
              addClass(getInputElement(), 'invalid');
              return false;
            }

            if (typeof validateResult === 'string') {
              state.editorErrorMessage = validateResult;
              addClass(getInputElement(), 'invalid');
              return false;
            }
          }
        }

        state.editorErrorMessage = '';
        removeClass(getInputElement(), 'invalid');
        return true;
      };

      const doClose = () => {
        if (!state.visible) return;
        state.visible = false;
        rendered.value = false;
        close();
        messageBox.closeDialog(); // 解绑

        if (lockScroll) {
          setTimeout(restoreBodyStyle, 200);
        }

        vue.nextTick(() => {
          if (state.action) {
            vue.unref(callback)(state.action, instance.vnode);
          }
        });
      };

      const getSafeClose = () => {
        const currentId = state.uid;
        return () => {
          vue.nextTick(() => {
            if (currentId === state.uid) doClose();
          });
        };
      };

      const confirmButtonLoading = vue.ref(false);

      const handleAction = action => {
        if (vue.unref(_type) === 'prompt' && action === 'confirm' && !validate()) {
          return;
        }

        state.action = action;

        if (typeof vue.unref(beforeClose) === 'function') {
          const close = getSafeClose();
          vue.unref(beforeClose)(action, instance.vnode, close);
        } else {
          doClose();
        }
      };

      const handleWrapperClick = () => {
        if (vue.unref(closeOnClickModal)) {
          handleAction(vue.unref(distinguishCancelAndClose) ? 'close' : 'cancel');
        }
      };

      const handleKeyup = (element = {}) => {
        if (element.code !== 'Escape') return;

        if (vue.unref(props.closeOnPressEscape)) {
          handleAction(vue.unref(distinguishCancelAndClose) ? 'close' : 'cancel');
        }
      };

      const handleInputEnter = () => {
        if (vue.unref(inputType) !== 'textarea') {
          return handleAction('confirm');
        }
      };

      const icon = vue.computed(() => {
        return vue.unref(iconClass) || (vue.unref(type) && typeMap[vue.unref(type)] ? `el-icon-${typeMap[vue.unref(type)]}` : '');
      });
      const cancelButtonClasses = vue.computed(() => {
        return `el-button--primary ${vue.unref(cancelButtonClass)}`;
      });
      const confirmButtonClasses = vue.computed(() => {
        return `el-button--primary ${vue.unref(confirmButtonClass)}`;
      });

      const getFirstFocus = () => {
        const btn = instance.vnode.el.querySelector('.el-message-box__btns .el-button');
        const title = instance.vnode.el.querySelector('.el-message-box__btns .el-message-box__title');
        return btn || title;
      };

      const getInputElement = () => {
        const inputRefs = instance.refs.input.$refs;
        return inputRefs.input || inputRefs.textarea;
      };

      vue.onMounted(() => {
        state.visible = true;
        vue.nextTick(() => {
          state.uid++;
          rendered.value = true;
          open();
        });

        if (vue.unref(_type) === 'alert' || vue.unref(_type) === 'confirm') {
          vue.nextTick(() => {
            instance.refs.confirm.$el.focus();
          });
        }

        const focusAfterClosed = document.activeElement;
        messageBox = new Dialog(instance.vnode.el, focusAfterClosed, getFirstFocus());

        if (vue.unref(closeOnHashChange)) {
          window.addEventListener('hashchange', doClose);
        }

        window.addEventListener('keyup', handleKeyup);
        if (vue.unref(_type) !== 'prompt') return;
        setTimeout(() => {
          if (instance.refs.input && instance.refs.input.$el) {
            getInputElement().focus();
          }
        }, 500);
      });
      vue.onUnmounted(() => {
        if (vue.unref(closeOnHashChange)) {
          window.removeEventListener('hashchange', doClose);
        }

        window.removeEventListener('keyup', handleKeyup);
        setTimeout(() => {
          messageBox.closeDialog();
        });
      });

      const MessageToVNode = message => {
        let v = '';

        if (vue.isVNode(vue.unref(message))) {
          v = vue.unref(message);
          vue.render(v, document.createElement('div'));
          state.isVnode = true;
          return v.el.innerHTML;
        } else {
          state.isVnode = false;
          return message;
        }
      };

      vue.watch(() => state.inputValue, val => {
        vue.nextTick(() => {
          if (vue.unref(_type) === 'prompt' && val !== null) {
            validate();
          }
        });
      });
      return { ...vue.toRefs(props),
        changedMessage: MessageToVNode(message),
        handleInputEnter,
        handleAction,
        state,
        handleWrapperClick,
        icon,
        cancelButtonClasses,
        cancelButtonText,
        t,
        confirmButtonLoading,
        confirmButtonClasses,
        confirmButtonText
      };
    }

  };

  const _hoisted_1$n = {
    key: 0,
    class: "el-message-box__header"
  };
  const _hoisted_2$e = {
    class: "el-message-box__title"
  };

  const _hoisted_3$c = /*#__PURE__*/vue.createVNode("i", {
    class: "el-message-box__close el-icon-close"
  }, null, -1
  /* HOISTED */
  );

  const _hoisted_4$8 = {
    class: "el-message-box__content"
  };
  const _hoisted_5$5 = {
    class: "el-message-box__container"
  };
  const _hoisted_6$3 = {
    key: 1,
    class: "el-message-box__message"
  };
  const _hoisted_7$2 = {
    key: 0
  };
  const _hoisted_8$1 = {
    class: "el-message-box__input"
  };
  const _hoisted_9$1 = {
    class: "el-message-box__btns"
  };
  function render$t(_ctx, _cache, $props, $setup, $data, $options) {
    const _component_el_input = vue.resolveComponent("el-input");

    const _component_el_button = vue.resolveComponent("el-button");

    return vue.openBlock(), vue.createBlock(vue.Transition, {
      name: "msgbox-fade"
    }, {
      default: vue.withCtx(() => [vue.withDirectives(vue.createVNode("div", {
        class: "el-message-box__wrapper",
        tabindex: "-1",
        role: "dialog",
        "aria-modal": "true",
        onClick: _cache[8] || (_cache[8] = vue.withModifiers((...args) => $setup.handleWrapperClick && $setup.handleWrapperClick(...args), ["self"])),
        "aria-label": $props.title || 'dialog'
      }, [vue.createVNode("div", {
        class: ["el-message-box", [$props.customClass, $props.center && 'el-message-box--center']]
      }, [$props.title !== null ? (vue.openBlock(), vue.createBlock("div", _hoisted_1$n, [vue.createVNode("div", _hoisted_2$e, [$setup.icon && $props.center ? (vue.openBlock(), vue.createBlock("div", {
        key: 0,
        class: ['el-message-box__status', $setup.icon]
      }, null, 2
      /* CLASS */
      )) : vue.createCommentVNode("v-if", true), vue.createVNode("span", null, vue.toDisplayString($props.title), 1
      /* TEXT */
      )]), $props.showClose ? (vue.openBlock(), vue.createBlock("button", {
        key: 0,
        type: "button",
        class: "el-message-box__headerbtn",
        "aria-label": "Close",
        onClick: _cache[1] || (_cache[1] = $event => $setup.handleAction($props.distinguishCancelAndClose ? 'close' : 'cancel')),
        onKeydown: _cache[2] || (_cache[2] = vue.withKeys($event => $setup.handleAction($props.distinguishCancelAndClose ? 'close' : 'cancel'), ["enter"]))
      }, [_hoisted_3$c], 32
      /* HYDRATE_EVENTS */
      )) : vue.createCommentVNode("v-if", true)])) : vue.createCommentVNode("v-if", true), vue.createVNode("div", _hoisted_4$8, [vue.createVNode("div", _hoisted_5$5, [$setup.icon && !$props.center && $setup.changedMessage !== '' ? (vue.openBlock(), vue.createBlock("div", {
        key: 0,
        class: ['el-message-box__status', $setup.icon]
      }, null, 2
      /* CLASS */
      )) : vue.createCommentVNode("v-if", true), $setup.changedMessage !== '' ? (vue.openBlock(), vue.createBlock("div", _hoisted_6$3, [vue.renderSlot(_ctx.$slots, "default", {}, () => [!$props.dangerouslyUseHTMLString && $setup.state.isVnode !== true ? (vue.openBlock(), vue.createBlock("p", _hoisted_7$2, vue.toDisplayString($setup.changedMessage), 1
      /* TEXT */
      )) : (vue.openBlock(), vue.createBlock("p", {
        key: 1,
        innerHTML: $setup.changedMessage
      }, null, 8
      /* PROPS */
      , ["innerHTML"]))])])) : vue.createCommentVNode("v-if", true)]), vue.withDirectives(vue.createVNode("div", _hoisted_8$1, [vue.createVNode(_component_el_input, {
        onKeydown: vue.withKeys($setup.handleInputEnter, ["enter"]),
        type: $props.inputType,
        modelValue: $setup.state.inputValue,
        "onUpdate:modelValue": _cache[3] || (_cache[3] = $event => $setup.state.inputValue = $event),
        placeholder: $props.inputPlaceholder,
        ref: "input"
      }, null, 8
      /* PROPS */
      , ["onKeydown", "type", "modelValue", "placeholder"]), vue.createVNode("div", {
        class: "el-message-box__errormsg",
        style: {
          visibility: !!$setup.state.editorErrorMessage ? 'visible' : 'hidden'
        }
      }, vue.toDisplayString($setup.state.editorErrorMessage), 5
      /* TEXT, STYLE */
      )], 512
      /* NEED_PATCH */
      ), [[vue.vShow, $props.showInput]])]), vue.createVNode("div", _hoisted_9$1, [$props.showCancelButton ? (vue.openBlock(), vue.createBlock(_component_el_button, {
        key: 0,
        loading: $props.cancelButtonLoading,
        class: [$setup.cancelButtonClasses],
        round: $props.roundButton,
        size: "small",
        onClick: _cache[4] || (_cache[4] = $event => $setup.handleAction('cancel')),
        onKeydown: _cache[5] || (_cache[5] = vue.withKeys($event => $setup.handleAction('cancel'), ["enter"]))
      }, {
        default: vue.withCtx(() => [vue.createTextVNode(vue.toDisplayString($setup.cancelButtonText || $setup.t('el.messagebox.cancel')), 1
        /* TEXT */
        )]),
        _: 1
        /* STABLE */

      }, 8
      /* PROPS */
      , ["loading", "class", "round"])) : vue.createCommentVNode("v-if", true), vue.withDirectives(vue.createVNode(_component_el_button, {
        loading: $setup.confirmButtonLoading,
        ref: "confirm",
        class: [$setup.confirmButtonClasses],
        round: $props.roundButton,
        size: "small",
        onClick: _cache[6] || (_cache[6] = $event => $setup.handleAction('confirm')),
        onKeydown: _cache[7] || (_cache[7] = vue.withKeys($event => $setup.handleAction('confirm'), ["enter"]))
      }, {
        default: vue.withCtx(() => [vue.createTextVNode(vue.toDisplayString($setup.confirmButtonText || $setup.t('el.messagebox.confirm')), 1
        /* TEXT */
        )]),
        _: 1
        /* STABLE */

      }, 8
      /* PROPS */
      , ["loading", "class", "round"]), [[vue.vShow, $props.showConfirmButton]])])], 2
      /* CLASS */
      )], 8
      /* PROPS */
      , ["aria-label"]), [[vue.vShow, $setup.state.visible]])]),
      _: 1
      /* STABLE */

    });
  }

  script$z.render = render$t;
  script$z.__file = "packages/message-box/src/MessageBox.vue";

  // #todo
  const messageBoxConstructor = vue.defineComponent(script$z);
  const defaults = {
    title: null,
    message: '',
    type: '',
    iconClass: '',
    showInput: false,
    showClose: true,
    modalFade: true,
    lockScroll: true,
    closeOnClickModal: true,
    closeOnPressEscape: true,
    closeOnHashChange: true,
    inputValue: null,
    inputPlaceholder: '',
    inputType: 'text',
    inputPattern: null,
    inputValidator: null,
    inputErrorMessage: '',
    showConfirmButton: true,
    showCancelButton: false,
    confirmButtonPosition: 'right',
    confirmButtonHighlight: false,
    cancelButtonHighlight: false,
    confirmButtonText: '',
    cancelButtonText: '',
    confirmButtonClass: '',
    cancelButtonClass: '',
    customClass: '',
    beforeClose: null,
    dangerouslyUseHTMLString: false,
    center: false,
    roundButton: false,
    distinguishCancelAndClose: false
  }; // const MessageBoxConstructor = {
  //   extends: msgboxVue
  // }

  let currentMsg, instance;
  let msgQueue = [];

  const defaultCallback = action => {
    if (currentMsg) {
      if (currentMsg.resolve) {
        if (action === 'confirm') {
          if (instance.vnode.props.showInput) {
            currentMsg.resolve({
              value: instance.setupState.state.inputValue,
              action
            });
          } else {
            currentMsg.resolve(action);
          }
        } else if (currentMsg.reject && (action === 'cancel' || action === 'close')) {
          currentMsg.reject(action);
        }
      }
    }
  };

  const initInstance = (currentMsg, VNode = null) => {
    defaults.callback = defaultCallback;
    instance = createComponent(messageBoxConstructor, currentMsg.options, VNode);
  };

  const showNextMsg = () => {
    if (msgQueue.length > 0) {
      currentMsg = msgQueue.shift();
      const options = currentMsg.options;

      if (options.callback === undefined) {
        options.callback = defaultCallback;
      }

      const oldCb = options.callback;

      options.callback = (action, instance) => {
        oldCb(action, instance);
      };

      if (vue.isVNode(currentMsg.message)) {
        initInstance(currentMsg, {
          default: () => currentMsg.message
        });
      }

      initInstance(currentMsg);
      ['modal', 'showClose', 'closeOnClickModal', 'closeOnPressEscape', 'closeOnHashChange'].forEach(prop => {
        if (options[prop] === undefined) {
          options[prop] = true;
        }
      });
      document.body.appendChild(instance.vnode.el);
    } // }

  };

  const MessageBox = function (options, callback) {
    // if (Vue.prototype.$isServer) return
    if (typeof options === 'string' || vue.isVNode(options)) {
      options = {
        message: options
      };

      if (typeof arguments[1] === 'string') {
        options.title = arguments[1];
      }
    } else if (options.callback && !callback) {
      callback = options.callback;
    }

    if (typeof Promise !== 'undefined') {
      return new Promise((resolve, reject) => {
        // eslint-disable-line
        msgQueue.push({
          options: merge({}, defaults, MessageBox.defaults, options),
          callback: callback,
          resolve: resolve,
          reject: reject
        });
        showNextMsg();
      });
    } else {
      msgQueue.push({
        options: merge({}, defaults, MessageBox.defaults, options),
        callback: callback
      });
      showNextMsg();
    }
  };

  MessageBox.setDefaults = defaults => {
    MessageBox.defaults = defaults;
  };

  MessageBox.alert = (message, title, options) => {
    if (typeof title === 'object') {
      options = title;
      title = '';
    } else if (title === undefined) {
      title = '';
    }

    return MessageBox(merge({
      title: title,
      message: message,
      _type: 'alert',
      closeOnPressEscape: false,
      closeOnClickModal: false
    }, options));
  };

  MessageBox.confirm = (message, title, options) => {
    if (typeof title === 'object') {
      options = title;
      title = '';
    } else if (title === undefined) {
      title = '';
    }

    return MessageBox(merge({
      title: title,
      message: message,
      _type: 'confirm',
      showCancelButton: true
    }, options));
  };

  MessageBox.prompt = (message, title, options) => {
    if (typeof title === 'object') {
      options = title;
      title = '';
    } else if (title === undefined) {
      title = '';
    }

    return MessageBox(merge({
      title: title,
      message: message,
      showCancelButton: true,
      showInput: true,
      _type: 'prompt'
    }, options));
  };

  MessageBox.close = () => {
    instance.doClose();
    msgQueue = [];
    currentMsg = null;
  };

  const notificationProps = {
    customClass: {
      type: String,
      default: ''
    },
    dangerouslyUseHTMLString: {
      type: Boolean,
      default: false
    },
    duration: {
      type: Number,
      default: 4500
    },
    iconClass: {
      type: String,
      default: ''
    },
    id: {
      type: String,
      default: ''
    },
    verticalOffset: {
      type: Number,
      default: 0
    },
    message: [String, Object],
    position: {
      type: String,
      default: 'top-right'
    },
    onClick: null,
    showClose: {
      type: Boolean,
      default: true
    },
    title: {
      type: String,
      default: ''
    },
    type: {
      type: String,
      default: '',

      validator(val) {
        return ['', 'success', 'warning', 'info', 'error'].includes(val);
      }

    }
  };

  var script$y = vue.defineComponent({
    name: 'ElNotification',
    props: notificationProps,
    emits: ['close'],

    setup(props, {
      emit
    }) {
      const instance = vue.getCurrentInstance();
      const visible = vue.ref(true);
      const verticalOffsetVal = vue.ref(props.verticalOffset);
      const typeClass = vue.computed(() => {
        return props.type ? `el-icon-${props.type}` : '';
      });
      const horizontalClass = vue.computed(() => {
        return props.position.endsWith('right') ? 'right' : 'left';
      });
      const verticalProperty = vue.computed(() => {
        return props.position.startsWith('top') ? 'top' : 'bottom';
      });
      const positionStyle = vue.computed(() => {
        return {
          [verticalProperty.value]: `${verticalOffsetVal.value}px`
        };
      });

      function _click() {
        emit('click', instance);
      }

      function handleClick() {
        _click();
      }

      function click() {
        _click();
      }

      function _close() {
        clearTimeout(timer);
        emit('close', instance);
        visible.value = false;
      }

      function handleClose() {
        _close();
      }

      function close() {
        _close();
      }

      let timer;

      function delayClose() {
        if (props.duration > 0) {
          timer = setTimeout(() => {
            _close();
          }, props.duration);
        }
      }

      const handleKeydown = e => {
        if (e.keyCode === 46 || e.keyCode === 8) {
          clearTimeout(timer);
        } else if (e.keyCode === 27) {
          _close();
        } else {
          delayClose();
        }
      };

      function handleMouseenter() {
        clearTimeout(timer);
      }

      function handleMouseleave() {
        delayClose();
      }

      function handleAfterLeave() {
        var _instance$vnode$el$pa;

        (_instance$vnode$el$pa = instance.vnode.el.parentElement) === null || _instance$vnode$el$pa === void 0 ? void 0 : _instance$vnode$el$pa.removeChild(instance.vnode.el);
      }

      delayClose();
      return {
        close,
        click,
        visible,
        typeClass,
        positionStyle,
        horizontalClass,
        verticalProperty,
        verticalOffsetVal,
        handleClose,
        handleClick,
        handleKeydown,
        handleMouseenter,
        handleMouseleave,
        handleAfterLeave
      };
    }

  });

  const _hoisted_1$m = {
    class: "el-notification__group"
  };
  const _hoisted_2$d = {
    class: "el-notification__content"
  };
  const _hoisted_3$b = {
    key: 0
  };
  function render$s(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock(vue.Transition, {
      name: "el-notification-fade",
      onAfterLeave: _ctx.handleAfterLeave,
      appear: ""
    }, {
      default: vue.withCtx(() => [vue.withDirectives(vue.createVNode("div", {
        class: ['el-notification', _ctx.customClass, _ctx.horizontalClass],
        style: _ctx.positionStyle,
        onClick: _cache[2] || (_cache[2] = (...args) => _ctx.handleClick && _ctx.handleClick(...args)),
        onKeydown: _cache[3] || (_cache[3] = (...args) => _ctx.handleKeydown && _ctx.handleKeydown(...args)),
        onMouseenter: _cache[4] || (_cache[4] = (...args) => _ctx.handleMouseenter && _ctx.handleMouseenter(...args)),
        onMouseleave: _cache[5] || (_cache[5] = (...args) => _ctx.handleMouseleave && _ctx.handleMouseleave(...args)),
        role: "alert"
      }, [_ctx.type || _ctx.iconClass ? (vue.openBlock(), vue.createBlock("i", {
        key: 0,
        class: ["el-notification__icon", _ctx.typeClass || _ctx.iconClass]
      }, null, 2
      /* CLASS */
      )) : vue.createCommentVNode("v-if", true), vue.createVNode("div", _hoisted_1$m, [vue.createVNode("h2", {
        class: "el-notification__title",
        textContent: vue.toDisplayString(_ctx.title)
      }, null, 8
      /* PROPS */
      , ["textContent"]), vue.withDirectives(vue.createVNode("div", _hoisted_2$d, [vue.renderSlot(_ctx.$slots, "default", {}, () => [!_ctx.dangerouslyUseHTMLString ? (vue.openBlock(), vue.createBlock("p", _hoisted_3$b, vue.toDisplayString(_ctx.message), 1
      /* TEXT */
      )) : (vue.openBlock(), vue.createBlock("p", {
        key: 1,
        innerHTML: _ctx.message
      }, null, 8
      /* PROPS */
      , ["innerHTML"]))])], 512
      /* NEED_PATCH */
      ), [[vue.vShow, _ctx.message]]), _ctx.showClose ? (vue.openBlock(), vue.createBlock("div", {
        key: 0,
        class: "el-notification__closeBtn el-icon-close",
        onClick: _cache[1] || (_cache[1] = (...args) => _ctx.handleClose && _ctx.handleClose(...args))
      })) : vue.createCommentVNode("v-if", true)])], 38
      /* CLASS, STYLE, HYDRATE_EVENTS */
      ), [[vue.vShow, _ctx.visible]])]),
      _: 3
      /* FORWARDED */

    }, 8
    /* PROPS */
    , ["onAfterLeave"]);
  }

  script$y.render = render$s;
  script$y.__file = "src/components/Notification/src/Notification.vue";

  const instanceList = [];
  const INTERVAL_HEIGHT = 16;
  function Notification(options) {
    return createNotification(mergeProps(options));
  }

  function addInstance(instance) {
    instanceList.push(instance);
  }

  function createNotification(options) {
    const instance = createNotificationByOpts(options);
    setZIndex(instance);
    addInstance(instance);
    addToBody(instance);
    return instance.proxy;
  }

  function createNotificationByOpts(opts) {
    if (vue.isVNode(opts.message)) {
      return createComponent(script$y, opts, () => opts.message);
    }

    return createComponent(script$y, opts);
  }

  function setZIndex(instance) {
    instance.vnode.el.style.zIndex = PopupManager.nextZIndex();
  }

  function addToBody(instance) {
    document.body.append(instance.vnode.el);
  }

  function mergeProps(options) {
    const position = options.position || 'top-right';
    const verticalOffset = calculateVerticalOffset(position);
    const defaultOptions = {
      position,
      verticalOffset
    };
    const userOnClose = options === null || options === void 0 ? void 0 : options.onClose;
    options === null || options === void 0 ? true : delete options.onClose;

    defaultOptions.onClose = instance => {
      closeNotification(instance);
      if (userOnClose) userOnClose(instance.proxy);
    };

    const userOnClick = options === null || options === void 0 ? void 0 : options.onClick;
    options === null || options === void 0 ? true : delete options.onClick;

    defaultOptions.onClick = instance => {
      if (userOnClick) userOnClick(instance.proxy);
    };

    if (typeof options === 'string' || vue.isVNode(options)) {
      defaultOptions.message = options;
      return defaultOptions;
    }

    return Object.assign({}, defaultOptions, options);
  }

  function calculateVerticalOffset(position, offset = 0) {
    let verticalOffset = offset;
    instanceList.filter(instance => instance.props.position === position).forEach(instance => {
      verticalOffset += (instance.vnode.el.offsetHeight || 0) + INTERVAL_HEIGHT;
    });
    verticalOffset += INTERVAL_HEIGHT;
    return verticalOffset;
  }

  function closeNotification(instance) {
    updatePosition(instance);
  }

  function updatePosition(closeInstance) {
    const currentInstanceIndex = getIndexByInstance(closeInstance);
    if (currentInstanceIndex < 0) return;
    const instance = instanceList[currentInstanceIndex];
    const len = instanceList.length;
    removeInstance(instance);
    if (len <= 1) return;
    const position = instance.props.position;
    const removedHeight = instance.vnode.el.offsetHeight;

    for (let i = currentInstanceIndex; i < len - 1; i++) {
      if (instanceList[i].props.position === position) {
        instanceList[i].vnode.el.style[instance.props.position.startsWith('top') ? 'top' : 'bottom'] = parseInt(instanceList[i].vnode.el.style[instance.props.position.startsWith('top') ? 'top' : 'bottom'], 10) - removedHeight - INTERVAL_HEIGHT + 'px';
      }
    }
  }

  function removeInstance(instance) {
    instanceList.splice(getIndexByInstance(instance), 1);
  }

  function getIndexByInstance(instance) {
    return instanceList.findIndex(i => i.uid == instance.uid);
  }
  ['success', 'warning', 'info', 'error'].forEach(type => {
    Notification[type] = options => {
      if (typeof options === 'string' || vue.isVNode(options)) {
        options = {
          message: options
        };
      }

      options.type = type;
      return Notification(options);
    };
  });

  Notification.closeAll = () => {
    instanceList.forEach(instance => {
      instance.proxy.close();
      removeInstance(instance);
    });
  };

  const SubMenu = function (parent, domNode) {
    this.domNode = domNode;
    this.parent = parent;
    this.subMenuItems = [];
    this.subIndex = 0;
    this.init();
  };

  SubMenu.prototype.init = function () {
    this.subMenuItems = this.domNode.querySelectorAll('li');
    this.addListeners();
  };

  SubMenu.prototype.gotoSubIndex = function (idx) {
    if (idx === this.subMenuItems.length) {
      idx = 0;
    } else if (idx < 0) {
      idx = this.subMenuItems.length - 1;
    }

    this.subMenuItems[idx].focus();
    this.subIndex = idx;
  };

  SubMenu.prototype.addListeners = function () {
    const keys = Utils.keys;
    const parentNode = this.parent.domNode;
    Array.prototype.forEach.call(this.subMenuItems, el => {
      el.addEventListener('keydown', event => {
        let prevDef = false;

        switch (event.keyCode) {
          case keys.down:
            this.gotoSubIndex(this.subIndex + 1);
            prevDef = true;
            break;

          case keys.up:
            this.gotoSubIndex(this.subIndex - 1);
            prevDef = true;
            break;

          case keys.tab:
            Utils.triggerEvent(parentNode, 'mouseleave');
            break;

          case keys.enter:
          case keys.space:
            prevDef = true;
            event.currentTarget.click();
            break;
        }

        if (prevDef) {
          event.preventDefault();
          event.stopPropagation();
        }

        return false;
      });
    });
  };

  const MenuItem = function (domNode) {
    this.domNode = domNode;
    this.submenu = null;
    this.init();
  };

  MenuItem.prototype.init = function () {
    this.domNode.setAttribute('tabindex', '0');
    const menuChild = this.domNode.querySelector('.el-menu');

    if (menuChild) {
      this.submenu = new SubMenu(this, menuChild);
    }

    this.addListeners();
  };

  MenuItem.prototype.addListeners = function () {
    const keys = Utils.keys;
    this.domNode.addEventListener('keydown', event => {
      let prevDef = false;

      switch (event.keyCode) {
        case keys.down:
          Utils.triggerEvent(event.currentTarget, 'mouseenter');
          this.submenu && this.submenu.gotoSubIndex(0);
          prevDef = true;
          break;

        case keys.up:
          Utils.triggerEvent(event.currentTarget, 'mouseenter');
          this.submenu && this.submenu.gotoSubIndex(this.submenu.subMenuItems.length - 1);
          prevDef = true;
          break;

        case keys.tab:
          Utils.triggerEvent(event.currentTarget, 'mouseleave');
          break;

        case keys.enter:
        case keys.space:
          prevDef = true;
          event.currentTarget.click();
          break;
      }

      if (prevDef) {
        event.preventDefault();
      }
    });
  };

  const Menu = function (domNode) {
    this.domNode = domNode;
    this.init();
  };

  Menu.prototype.init = function () {
    const menuChildren = this.domNode.childNodes;
    [].filter.call(menuChildren, child => child.nodeType === 1).forEach(child => {
      new MenuItem(child); // eslint-disable-line
    });
  };

  function useMenu(index) {
    const Instance = vue.getCurrentInstance();
    const rootMenu = vue.inject('rootMenu');
    const parent = Instance.parent;
    const indexPath = vue.computed(() => {
      const path = [index];
      let p = parent;

      while (p.type.name !== 'ElMenu') {
        if (p.props.index) {
          path.unshift(p.props.index);
        }

        p = p.parent;
      }

      return path;
    });
    const parentMenu = vue.computed(() => {
      let p = parent;

      while (p && ['ElMenu', 'ElSubmenu'].indexOf(p.type.name) === -1) {
        p = p.parent;
      }

      return p;
    });
    const paddingStyle = vue.computed(() => {
      if (rootMenu.props.mode !== 'vertical') return {};
      let padding = 20;
      let p = parent;

      if (rootMenu.props.collapse) {
        padding = 20;
      } else {
        while (p && p.type.name !== 'ElMenu') {
          if (p.type.name === 'ElSubmenu') {
            padding += 20;
          }

          p = p.parent;
        }
      }

      return {
        paddingLeft: padding + 'px'
      };
    });
    return {
      indexPath,
      parentMenu,
      paddingStyle,
      rootMenu
    };
  }

  function useItems() {
    const items = vue.reactive({});
    const itemsInstance = {};
    const submenus = vue.reactive({});
    const submenusInstance = {};

    const addItem = item => {
      let index = item.props.index;
      items[index] = index;
      itemsInstance[index] = item;
    };

    const removeItem = item => {
      let index = item.props.index;
      delete items[index];
      delete itemsInstance[index];
    };

    const addSubmenu = item => {
      let index = item.props.index;
      submenus[index] = index;
      submenusInstance[index] = item;
    };

    const removeSubmenu = item => {
      let index = item.props.index;
      delete submenus[index];
      delete submenusInstance[index];
    };

    return {
      items,
      itemsInstance,
      submenus,
      submenusInstance,
      addItem,
      removeItem,
      addSubmenu,
      removeSubmenu
    };
  }

  var script$x = {
    render(proxy) {
      const data = {
        mode: 'out-in',

        onBeforeEnter(el) {
          el.style.opacity = 0.2;
        },

        onEnter(el) {
          addClass(el, 'el-opacity-transition');
          el.style.opacity = 1;
        },

        onAfterEnter(el) {
          removeClass(el, 'el-opacity-transition');
          el.style.opacity = '';
        },

        onBeforeLeave(el) {
          if (!el.dataset) el.dataset = {};

          if (hasClass(el, 'el-menu--collapse')) {
            removeClass(el, 'el-menu--collapse');
            el.dataset.oldOverflow = el.style.overflow;
            el.dataset.scrollWidth = el.clientWidth;
            addClass(el, 'el-menu--collapse');
          } else {
            addClass(el, 'el-menu--collapse');
            el.dataset.oldOverflow = el.style.overflow;
            el.dataset.scrollWidth = el.clientWidth;
            removeClass(el, 'el-menu--collapse');
          }

          el.style.width = el.scrollWidth + 'px';
          el.style.overflow = 'hidden';
        },

        onLeave(el) {
          addClass(el, 'horizontal-collapse-transition');
          el.style.width = el.dataset.scrollWidth + 'px';
        }

      };
      return vue.h(vue.Transition, data, proxy.$slots);
    }

  };

  script$x.__file = "packages/menu/MenuCollapseTransition.vue";

  function _isSlot$1(s) {
    return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !vue.isVNode(s);
  }

  var script$w = {
    name: 'ElMenu',
    componentName: 'ElMenu',

    render() {
      const component = vue.createVNode("ul", {
        "role": "menubar",
        "key": +this.collapse,
        "style": {
          backgroundColor: this.backgroundColor || ''
        },
        "class": {
          'el-menu--horizontal': this.mode === 'horizontal',
          'el-menu--collapse': this.collapse,
          'el-menu': true
        }
      }, [this.$slots.default()]);

      if (this.collapseTransition) {
        return vue.createVNode(vue.resolveComponent("el-menu-collapse-transition"), null, _isSlot$1(component) ? component : {
          default: () => [component]
        });
      } else {
        return component;
      }
    },

    components: {
      'el-menu-collapse-transition': script$x
    },
    props: {
      mode: {
        type: String,
        default: 'vertical'
      },
      defaultActive: {
        type: String,
        default: ''
      },
      defaultOpeneds: {
        type: Array,
        default: null
      },
      uniqueOpened: Boolean,
      router: Boolean,
      menuTrigger: {
        type: String,
        default: 'hover'
      },
      collapse: {
        type: Boolean,
        default: false
      },
      backgroundColor: {
        type: String,
        default: ''
      },
      textColor: String,
      activeTextColor: String,
      collapseTransition: {
        type: Boolean,
        default: true
      }
    },
    emits: ['close', 'open', 'select', 'on'],

    setup(props, {
      emit
    }) {
      const {
        defaultActive,
        defaultOpeneds,
        collapse,
        uniqueOpened,
        backgroundColor,
        mode,
        router
      } = vue.toRefs(props);
      const instance = vue.getCurrentInstance();
      const {
        broadcast,
        on
      } = useEmitter();
      const activeIndex = vue.ref(defaultActive.value);
      const openedMenus = vue.ref(defaultOpeneds.value && !collapse.value ? defaultOpeneds.value.slice(0) : []);
      const {
        items,
        itemsInstance,
        submenusInstance,
        addItem,
        removeItem,
        addSubmenu,
        removeSubmenu
      } = useItems();

      const updateActiveIndex = val => {
        let item = items[val] || items[activeIndex.value] || items[defaultActive.value];
        item = itemsInstance[item];

        if (item) {
          activeIndex.value = item.props.index;
          initOpenedMenu();
        } else {
          activeIndex.value = null;
        }
      };

      const getColorChannels = color => {
        color = color.replace('#', '');

        if (/^[0-9a-fA-F]{3}$/.test(color)) {
          color = color.split('');

          for (let i = 2; i >= 0; i--) {
            color.splice(i, 0, color[i]);
          }

          color = color.join('');
        }

        if (/^[0-9a-fA-F]{6}$/.test(color)) {
          return {
            red: parseInt(color.slice(0, 2), 16),
            green: parseInt(color.slice(2, 4), 16),
            blue: parseInt(color.slice(4, 6), 16)
          };
        } else {
          return {
            red: 255,
            green: 255,
            blue: 255
          };
        }
      };

      const mixColor = (color, percent) => {
        let {
          red,
          green,
          blue
        } = getColorChannels(color);

        if (percent > 0) {
          // shade given color
          red *= 1 - percent;
          green *= 1 - percent;
          blue *= 1 - percent;
        } else {
          // tint given color
          red += (255 - red) * percent;
          green += (255 - green) * percent;
          blue += (255 - blue) * percent;
        }

        return `rgb(${Math.round(red)}, ${Math.round(green)}, ${Math.round(blue)})`;
      };

      const openMenu = (index, indexPath) => {
        if (openedMenus.value.indexOf(index) !== -1) return; // 将不在该菜单路径下的其余菜单收起
        // collapse all menu that are not under current menu item

        if (uniqueOpened.value) {
          openedMenus.value.splice(0, openedMenus.value.length, ...vue.unref(indexPath));
        } else {
          openedMenus.value.push(index);
        }
      };

      const closeMenu = index => {
        const i = openedMenus.value.indexOf(index);

        if (i !== -1) {
          openedMenus.value.splice(i, 1);
        }
      };

      const handleSubmenuClick = submenu => {
        const {
          index,
          indexPath
        } = submenu.proxy;
        const isOpened = openedMenus.value.indexOf(index) !== -1;

        if (isOpened) {
          closeMenu(index);
          emit('close', index, indexPath);
        } else {
          openMenu(index, indexPath);
          emit('open', index, indexPath);
        }
      };

      const handleItemClick = item => {
        const {
          index,
          indexPath
        } = item.proxy;
        const oldActiveIndex = activeIndex.value;
        const hasIndex = index !== null;

        if (hasIndex) {
          activeIndex.value = index;
        }

        emit('select', index, indexPath, item);

        if (mode.value === 'horizontal' || collapse.value) {
          openedMenus.value.length = 0;
        }

        if (router.value && hasIndex) {
          routeToItem(item, error => {
            activeIndex.value = oldActiveIndex;

            if (error) {
              // vue-router 3.1.0+ push/replace cause NavigationDuplicated error
              // https://github.com/ElemeFE/element/issues/17044
              if (error.name === 'NavigationDuplicated') return;
              console.error(error);
            }
          });
        }
      };

      const initOpenedMenu = () => {
        const index = activeIndex.value;
        const activeItem = itemsInstance[index];
        if (!activeItem || mode.value === 'horizontal' || collapse.value) return;
        const indexPath = activeItem.setupState.indexPath; // 展开该菜单项的路径上所有子菜单
        // expand all submenus of the menu item

        indexPath.forEach(index => {
          const submenu = submenusInstance[index];
          submenu && openMenu(index, submenu.setupState.indexPath);
        });
      };

      const routeToItem = (item, onError) => {
        const route = item.proxy.route || item.proxy.index;

        try {
          instance.proxy.$router.push(route, () => {}, onError);
        } catch (e) {
          console.error(e);
        }
      };

      const open = index => {
        const {
          indexPath
        } = submenusInstance[index.toString()];
        indexPath.forEach(i => openMenu(i, indexPath));
      };

      const close = index => {
        closeMenu(index);
      };

      const hoverBackground = vue.computed(() => {
        return backgroundColor.value ? mixColor(backgroundColor.value, 0.2) : '';
      });
      const isMenuPopup = vue.computed(() => {
        return mode.value === 'horizontal' || mode.value === 'vertical' && collapse.value;
      });
      vue.watch(defaultActive, value => {
        if (!items[value]) {
          activeIndex.value = null;
        }

        updateActiveIndex(value);
      });
      vue.watch(defaultOpeneds, value => {
        if (!collapse.value) {
          openedMenus.value = value;
        }
      });
      vue.watch(collapse, value => {
        if (value) openedMenus.value = [];
        broadcast('toggle-collapse', value);
      });
      vue.onMounted(() => {
        initOpenedMenu();
        on('item-click', handleItemClick);
        on('submenu-click', handleSubmenuClick);

        if (mode.value === 'horizontal') {
          new Menu(instance.vnode.el);
        }

        vue.watch(items, updateActiveIndex);
      });
      vue.provide('rootMenu', instance);
      return {
        addItem,
        removeItem,
        addSubmenu,
        removeSubmenu,
        openedMenus,
        activeIndex,
        hoverBackground,
        isMenuPopup,
        openMenu,
        closeMenu,
        open,
        close
      };
    }

  };

  script$w.__file = "packages/menu/Menu.vue";

  /* istanbul ignore next */

  script$w.install = function (app) {
    app.component(script$w.name, script$w);
  };

  var script$v = {
    name: 'ElMenuItem',
    componentName: 'ElMenuItem',
    components: {
      ElTooltip
    },
    props: {
      index: {
        default: null,
        validator: val => typeof val === 'string' || val === null
      },
      route: [String, Object],
      disabled: Boolean
    },
    emits: ['click'],

    setup(props, {
      emit
    }) {
      const {
        index,
        disabled
      } = vue.toRefs(props);
      const {
        parentMenu,
        paddingStyle,
        rootMenu,
        indexPath
      } = useMenu(index.value);
      const instance = vue.getCurrentInstance();
      const {
        dispatch
      } = useEmitter();
      const active = vue.computed(() => {
        return index.value === rootMenu.proxy.activeIndex;
      });
      const hoverBackground = vue.computed(() => {
        return rootMenu.props.hoverBackground;
      });
      const backgroundColor = vue.computed(() => {
        return rootMenu.props.backgroundColor || '';
      });
      const itemBackgroundColor = vue.ref(backgroundColor.value);
      const activeTextColor = vue.computed(() => {
        return rootMenu.props.activeTextColor || '';
      });
      const textColor = vue.computed(() => {
        return rootMenu.props.textColor || '';
      });
      const mode = vue.computed(() => {
        return rootMenu.props.mode;
      });
      const isNested = vue.computed(() => {
        return parentMenu !== rootMenu;
      });
      const itemStyle = vue.computed(() => {
        const style = {
          color: active.value ? activeTextColor.value : textColor.value
        };

        if (mode.value === 'horizontal' && !isNested.value) {
          style.borderBottomColor = active.value ? rootMenu.activeTextColor.value ? activeTextColor.value : '' : 'transparent';
        }

        return style;
      });

      const onMouseEnter = () => {
        hoverBackground.value && (itemBackgroundColor.value = hoverBackground.value);
      };

      const onMouseLeave = () => {
        itemBackgroundColor.value = backgroundColor.value;
      };

      const handleClick = () => {
        if (!disabled.value) {
          dispatch('item-click', instance);
          emit('click', instance);
        }
      };

      vue.onMounted(() => {
        parentMenu.value.setupState.addItem(instance);
        rootMenu.setupState.addItem(instance);
      });
      vue.onBeforeUnmount(() => {
        parentMenu.value.setupState.removeItem(instance);
        rootMenu.setupState.removeItem(instance);
      });
      return {
        paddingStyle,
        itemStyle,
        active,
        handleClick,
        onMouseEnter,
        onMouseLeave,
        rootMenu,
        parentMenu,
        indexPath,
        itemBackgroundColor
      };
    }

  };

  const _hoisted_1$l = {
    style: {
      "position": "absolute",
      "left": "0",
      "top": "0",
      "height": "100%",
      "width": "100%",
      "display": "inline-block",
      "box-sizing": "border-box",
      "padding": "0 20px"
    }
  };
  function render$r(_ctx, _cache, $props, $setup, $data, $options) {
    const _component_el_tooltip = vue.resolveComponent("el-tooltip");

    return vue.openBlock(), vue.createBlock("li", {
      class: ["el-menu-item", {
        'is-active': $setup.active,
        'is-disabled': $props.disabled
      }],
      role: "menuitem",
      tabindex: "-1",
      style: [$setup.paddingStyle, $setup.itemStyle, {
        backgroundColor: $setup.itemBackgroundColor
      }],
      onClick: _cache[1] || (_cache[1] = (...args) => $setup.handleClick && $setup.handleClick(...args)),
      onMouseenter: _cache[2] || (_cache[2] = (...args) => $setup.onMouseEnter && $setup.onMouseEnter(...args)),
      onFocus: _cache[3] || (_cache[3] = (...args) => $setup.onMouseEnter && $setup.onMouseEnter(...args)),
      onBlur: _cache[4] || (_cache[4] = (...args) => $setup.onMouseLeave && $setup.onMouseLeave(...args)),
      onMouseleave: _cache[5] || (_cache[5] = (...args) => $setup.onMouseLeave && $setup.onMouseLeave(...args))
    }, [$setup.parentMenu.type.name === 'ElMenu' && $setup.rootMenu.proxy.collapse && _ctx.$slots.title ? (vue.openBlock(), vue.createBlock(_component_el_tooltip, {
      key: 0,
      effect: "dark",
      placement: "right"
    }, {
      content: vue.withCtx(() => [vue.createVNode("div", null, [vue.renderSlot(_ctx.$slots, "title")])]),
      default: vue.withCtx(() => [vue.createVNode("div", _hoisted_1$l, [vue.renderSlot(_ctx.$slots, "default")])]),
      _: 3
      /* FORWARDED */

    })) : (vue.openBlock(), vue.createBlock(vue.Fragment, {
      key: 1
    }, [vue.renderSlot(_ctx.$slots, "default"), vue.renderSlot(_ctx.$slots, "title")], 64
    /* STABLE_FRAGMENT */
    ))], 38
    /* CLASS, STYLE, HYDRATE_EVENTS */
    );
  }

  script$v.render = render$r;
  script$v.__file = "packages/menu/MenuItem.vue";

  /* istanbul ignore next */

  script$v.install = function (app) {
    app.component(script$v.name, script$v);
  };

  var script$u = {
    name: 'ElSubmenu',
    componentName: 'ElSubmenu',
    components: {
      ElCollapseTransition
    },
    props: { ...popperProps,
      transformOrigin: {
        type: [Boolean, String],
        default: false
      },
      index: {
        type: String,
        required: true
      },
      showTimeout: {
        type: Number,
        default: 300
      },
      hideTimeout: {
        type: Number,
        default: 300
      },
      popperClass: String,
      disabled: Boolean,
      popperAppendToBody: {
        type: Boolean,
        default: undefined
      }
    },
    emits: ['updatePopper', 'visible', 'update:modelValue', 'created'],

    setup(props, {
      emit,
      slots
    }) {
      const {
        index,
        disabled,
        showTimeout,
        hideTimeout,
        popperAppendToBody
      } = vue.toRefs(props);
      const popperElm = vue.ref(null);
      const referenceElm = vue.ref(null);
      const menu = vue.ref(null);
      const {
        doDestroy,
        showPopper,
        currentPlacement,
        updatePopper
      } = usePopper(props, {
        emit,
        slots
      }, {
        popperElm,
        referenceElm
      });
      const {
        parentMenu,
        paddingStyle,
        rootMenu,
        indexPath
      } = useMenu(index.value);
      const timeout = vue.ref(null);
      const {
        items,
        itemsInstance,
        submenus,
        submenusInstance,
        addItem,
        removeItem,
        addSubmenu,
        removeSubmenu
      } = useItems();
      const mouseInChild = vue.ref(false);
      const instance = vue.getCurrentInstance();
      const {
        dispatch,
        on
      } = useEmitter();

      const handleCollapseToggle = value => {
        if (value) {
          initPopper();
        } else {
          doDestroy();
        }
      };

      const handleClick = () => {
        if (rootMenu.props.menuTrigger === 'hover' && rootMenu.props.mode === 'horizontal' || rootMenu.props.collapse && rootMenu.props.mode === 'vertical' || disabled.value) {
          return;
        }

        dispatch('submenu-click', instance);
      };

      const handleMouseenter = (event, delay = showTimeout.value) => {
        if (!('ActiveXObject' in window) && event.type === 'focus' && !event.relatedTarget) {
          return;
        }

        if (rootMenu.props.menuTrigger === 'click' && rootMenu.props.mode === 'horizontal' || !rootMenu.props.collapse && rootMenu.props.mode === 'vertical' || disabled.value) {
          return;
        }

        dispatch('mouse-enter-child');
        clearTimeout(timeout.value);
        timeout.value = setTimeout(() => {
          rootMenu.setupState.openMenu(index.value, indexPath);
        }, delay);

        if (appendToBody.value) {
          instance.parent.vnode.el.dispatchEvent(new MouseEvent('mouseenter'));
        }
      };

      const handleMouseleave = (deepDispatch = false) => {
        if (rootMenu.props.menuTrigger === 'click' && rootMenu.props.mode === 'horizontal' || !rootMenu.props.collapse && rootMenu.props.mode === 'vertical') {
          return;
        }

        dispatch('mouse-leave-child');
        clearTimeout(timeout.value);
        timeout.value = setTimeout(() => {
          !mouseInChild.value && rootMenu.setupState.closeMenu(index.value);
        }, hideTimeout.value);

        if (appendToBody.value && deepDispatch) {
          if (parentMenu.value && parentMenu.value.type.name === 'ElSubmenu') {
            parentMenu.value.setupState.handleMouseleave(true);
          }
        }
      };

      const handleTitleMouseenter = () => {
        hoverBackground.value && (titleBackground.value = hoverBackground.value);
      };

      const handleTitleMouseleave = () => {
        titleBackground.value = backgroundColor.value;
      };

      const isFirstLevel = vue.computed(() => {
        let isFirstLevel = true;
        let parent = instance.parent;

        while (parent && parent !== rootMenu) {
          if (['ElSubmenu', 'ElMenuItemGroup'].indexOf(parent.type.name) > -1) {
            isFirstLevel = false;
            break;
          } else {
            parent = parent.parent;
          }
        }

        return isFirstLevel;
      });

      const updatePlacement = () => {
        currentPlacement.value = mode.value === 'horizontal' && isFirstLevel.value ? 'bottom-start' : 'right-start';
      };

      const initPopper = () => {
        referenceElm.value = instance.vnode.el;
        popperElm.value = menu.value;
        updatePlacement();
      };

      const appendToBody = vue.computed(() => {
        return popperAppendToBody.value === undefined ? isFirstLevel : popperAppendToBody.value;
      });
      const menuTransitionName = vue.computed(() => {
        return rootMenu.props.collapse ? 'el-zoom-in-left' : 'el-zoom-in-top';
      });
      vue.watch(rootMenu.setupState.openedMenus, val => {
        showPopper.value = val.indexOf(index.value) > -1;
      });
      const active = vue.computed(() => {
        let isActive = false;
        Object.keys(items).forEach(index => {
          if (itemsInstance[index].proxy.active) {
            isActive = true;
          }
        });
        Object.keys(submenus).forEach(index => {
          if (submenusInstance[index].proxy.active) {
            isActive = true;
          }
        });
        return isActive;
      });
      const hoverBackground = vue.computed(() => {
        return rootMenu.setupState.hoverBackground;
      });
      const backgroundColor = vue.computed(() => {
        return rootMenu.props.backgroundColor || '';
      });
      const titleBackground = vue.ref(backgroundColor.value);
      const activeTextColor = vue.computed(() => {
        return rootMenu.props.activeTextColor || '';
      });
      const textColor = vue.computed(() => {
        return rootMenu.props.textColor || '';
      });
      const mode = vue.computed(() => {
        return rootMenu.props.mode;
      });
      const isMenuPopup = vue.computed(() => {
        return rootMenu.setupState.isMenuPopup;
      });
      const titleStyle = vue.computed(() => {
        if (mode.value !== 'horizontal') {
          return {
            color: textColor.value
          };
        }

        return {
          borderBottomColor: active.value ? activeTextColor.value ? activeTextColor.value : '' : 'transparent',
          color: active.value ? activeTextColor.value : textColor.value
        };
      });
      vue.watch(showPopper, () => {
        if (isMenuPopup.value) {
          vue.nextTick(() => {
            updatePopper();
          });
        }
      });
      on('toggle-collapse', handleCollapseToggle);
      on('mouse-enter-child', () => {
        mouseInChild.value = true;
        clearTimeout(timeout.value);
      });
      on('mouse-leave-child', () => {
        mouseInChild.value = false;
        clearTimeout(timeout.value);
      });
      vue.onMounted(() => {
        parentMenu.value.setupState.addSubmenu(instance);
        rootMenu.setupState.addSubmenu(instance);
        initPopper();
        showPopper.value = rootMenu.setupState.openedMenus.indexOf(index.value) > -1;
      });
      vue.onBeforeUnmount(() => {
        parentMenu.value.setupState.removeSubmenu(instance);
        rootMenu.setupState.removeSubmenu(instance);
      });
      return {
        active,
        paddingStyle,
        titleStyle,
        backgroundColor,
        rootMenu,
        currentPlacement,
        menuTransitionName,
        mode,
        isFirstLevel,
        isMenuPopup,
        handleTitleMouseleave,
        handleTitleMouseenter,
        handleClick,
        handleMouseenter,
        addItem,
        removeItem,
        addSubmenu,
        removeSubmenu,
        showPopper,
        handleMouseleave,
        menu,
        titleBackground,
        indexPath
      };
    },

    render() {
      const {
        active,
        showPopper,
        paddingStyle,
        titleStyle,
        backgroundColor,
        rootMenu,
        currentPlacement,
        menuTransitionName,
        mode,
        disabled,
        popperClass,
        $slots,
        isFirstLevel,
        isMenuPopup,
        handleMouseenter,
        handleMouseleave,
        handleClick,
        handleTitleMouseleave,
        handleTitleMouseenter,
        titleBackground
      } = this;

      const popupMenu = vue.createVNode(vue.Transition, {
        "name": menuTransitionName
      }, {
        default: () => [vue.withDirectives(vue.createVNode("div", {
          "ref": "menu",
          "class": [`el-menu--${mode}`, popperClass],
          "onMouseenter": $event => handleMouseenter($event, 100),
          "onMouseleave": () => handleMouseleave(true),
          "onFocus": $event => handleMouseenter($event, 100)
        }, [vue.createVNode("ul", {
          "role": "menu",
          "class": ['el-menu el-menu--popup', `el-menu--popup-${currentPlacement}`],
          "style": {
            backgroundColor
          }
        }, [$slots.default()])]), [[vue.vShow, showPopper]])]
      });

      const inlineMenu = vue.createVNode(vue.resolveComponent("el-collapse-transition"), null, {
        default: () => [vue.withDirectives(vue.createVNode("ul", {
          "role": "menu",
          "class": "el-menu el-menu--inline",
          "style": {
            backgroundColor
          }
        }, [$slots.default()]), [[vue.vShow, showPopper]])]
      });

      const submenuTitleIcon = rootMenu.props.mode === 'horizontal' && isFirstLevel || rootMenu.props.mode === 'vertical' && !rootMenu.props.collapse ? 'el-icon-arrow-down' : 'el-icon-arrow-right';
      return vue.createVNode("li", {
        "class": {
          'el-submenu': true,
          'is-active': active,
          'is-opened': showPopper,
          'is-disabled': disabled
        },
        "role": "menuitem",
        "aria-haspopup": "true",
        "aria-expanded": showPopper,
        "onMouseenter": handleMouseenter,
        "onMouseleave": () => {
          handleMouseleave(false);
        },
        "onFocus": handleMouseenter
      }, [vue.createVNode("div", {
        "class": "el-submenu__title",
        "onClick": handleClick,
        "onMouseenter": handleTitleMouseenter,
        "onMouseleave": handleTitleMouseleave,
        "style": [paddingStyle, titleStyle, {
          backgroundColor: titleBackground
        }]
      }, [$slots.title && $slots.title(), vue.createVNode("i", {
        "class": ['el-submenu__icon-arrow', submenuTitleIcon]
      }, null)]), isMenuPopup ? popupMenu : inlineMenu]);
    }

  };

  script$u.__file = "packages/menu/Submenu.vue";

  /* istanbul ignore next */

  script$u.install = function (app) {
    app.component(script$u.name, script$u);
  };

  var script$t = {
    name: 'ElMenuItemGroup',
    componentName: 'ElMenuItemGroup',
    props: {
      title: {
        type: String
      }
    },

    setup() {
      const instance = vue.getCurrentInstance();
      const rootMenu = vue.inject('rootMenu');
      const levelPadding = vue.computed(() => {
        let padding = 20;
        let parent = instance.parent;
        if (rootMenu.props.collapse) return 20;

        while (parent && parent.type.name !== 'ElMenu') {
          if (parent.type.name === 'ElSubmenu') {
            padding += 20;
          }

          parent = parent.parent;
        }

        return padding;
      });
      return {
        levelPadding
      };
    }

  };

  const _hoisted_1$k = {
    class: "el-menu-item-group"
  };
  function render$q(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("li", _hoisted_1$k, [vue.createVNode("div", {
      class: "el-menu-item-group__title",
      style: {
        paddingLeft: $setup.levelPadding + 'px'
      }
    }, [!_ctx.$slots.title ? (vue.openBlock(), vue.createBlock(vue.Fragment, {
      key: 0
    }, [vue.createTextVNode(vue.toDisplayString($props.title), 1
    /* TEXT */
    )], 64
    /* STABLE_FRAGMENT */
    )) : vue.renderSlot(_ctx.$slots, "title", {
      key: 1
    })], 4
    /* STYLE */
    ), vue.createVNode("ul", null, [vue.renderSlot(_ctx.$slots, "default")])]);
  }

  script$t.render = render$q;
  script$t.__file = "packages/menu/MenuItemGroup.vue";

  /* istanbul ignore next */

  script$t.install = function (app) {
    app.component(script$t.name, script$t);
  };

  var script$s = {
    name: 'ElTabs',
    props: {
      modelValue: [String, Number],
      type: {
        type: String,
        default: ''
      },
      closable: Boolean,
      addable: Boolean,
      editable: Boolean,
      tabPosition: {
        type: String,
        default: 'top'
      },
      stretch: Boolean,
      beforeLeave: {
        type: Function,
        default: () => () => true
      }
    },
    emits: ['update:modelValue', 'tab-click', 'tab-remove', 'tab-add', 'edit'],
    setup: function (props) {
      const tabList = vue.reactive([]);
      const tabElList = vue.reactive([]);
      const {
        scrollable,
        tabs,
        tabScroll,
        tabNav,
        direction,
        scrollToActive,
        handleClickLeft,
        handleClickRight
      } = useTabScroll({
        tabElList
      });
      const {
        state,
        handleClick,
        handleClose
      } = useTabNav({
        tabElList,
        tabList,
        scrollToActive
      });
      const {
        activeBarStyle
      } = useTabBarStyle({
        tabList,
        state,
        direction
      });
      vue.provide('elTabsInfo', {
        tabList,
        props,
        state
      });
      return {
        activeBarStyle,
        state,
        tabList,
        tabElList,
        scrollable,
        tabScroll,
        tabNav,
        tabs,
        handleClick,
        handleClose,
        handleClickLeft,
        handleClickRight
      };
    }
  };

  function useTabBarStyle({
    tabList,
    state,
    direction
  }) {
    const activeBarStyle = vue.computed(() => {
      const {
        sizeName,
        textSizeName,
        posName,
        dirFlag
      } = direction.value;
      return [`${sizeName}: ${tabList[state.activeIndex] && tabList[state.activeIndex][textSizeName]}px`, `transform: translate${dirFlag}(${tabList[state.activeIndex] && tabList[state.activeIndex][posName]}px)`];
    });
    return {
      activeBarStyle
    };
  }

  function useTabNav({
    tabList,
    tabElList,
    scrollToActive
  }) {
    const instance = vue.getCurrentInstance();
    const state = vue.reactive({
      activeName: '',
      activeIndex: -1
    });
    vue.watch(vue.toRefs(instance.props).modelValue || vue.ref(null), v => {
      const tabIndex = tabList.findIndex(item => item.name === v);
      if (tabIndex === -1) return;
      switchTab(tabList[tabIndex], tabIndex);
    });
    vue.onMounted(async () => {
      await vue.nextTick();
      if (!tabList.length) return;
      await handleClick(tabList[0], 0);
    });
    vue.onUpdated(async () => {
      await vue.nextTick();
      tabElList.forEach((el, index) => {
        const style = window.getComputedStyle(el);
        tabList[index].width = parseFloat(style.width);
        tabList[index].textWidth = parseFloat(style.width) - (parseFloat(style.paddingLeft) + parseFloat(style.paddingRight));
        tabList[index].height = parseFloat(style.height);
        tabList[index].textHeight = parseFloat(style.height) - (parseFloat(style.paddingTop) + parseFloat(style.paddingBottom));
        tabList[index].x = parseFloat(style.paddingLeft) + parseFloat(el.offsetLeft);
        tabList[index].y = parseFloat(style.paddingTop) + parseFloat(el.offsetTop);
      });
    });

    const switchTab = async (item, index) => {
      if (index === state.activeIndex) {
        return false;
      }

      if (item.disabled) {
        return false;
      }

      const isLeave = await instance.props.beforeLeave(item.name, state.activeName);

      if (!isLeave) {
        return false;
      }

      item.rendered = true;
      state.activeName = item.name;
      state.activeIndex = index;
      scrollToActive(item);
      return true;
    };

    const handleClick = async (item, index, e) => {
      await switchTab(item, index);
      instance.emit('update:modelValue', state.activeName);
      instance.emit('tab-click', tabList[index], e);
    };

    const handleClose = (item, index, e) => {
      tabList.splice(index, 1);
      vue.nextTick(() => {
        tabElList.splice(index, 1);
      });
      instance.emit('tab-remove', item.name, index, item, e);
      instance.emit('edit', item.name, 'remove');
    };

    return {
      state,
      handleClick,
      handleClose
    };
  }

  function useTabScroll({
    tabElList
  }) {
    const instance = vue.getCurrentInstance();
    const tabs = vue.ref(null);
    const tabScroll = vue.ref(null);
    const tabNav = vue.ref(null);
    const scrollable = vue.ref(false);
    const scrollSize = vue.ref(0);
    const direction = vue.computed(() => {
      const dirFlag = {
        bottom: true,
        top: true
      }[instance.props.tabPosition] ? 'X' : 'Y';
      const sizeName = {
        X: 'width',
        Y: 'height'
      }[dirFlag];
      const textSizeName = {
        X: 'textWidth',
        Y: 'textHeight'
      }[dirFlag];
      const offsetName = {
        X: 'offsetWidth',
        Y: 'offsetHeight'
      }[dirFlag];
      const scrollName = {
        X: 'scrollWidth',
        Y: 'scrollHeight'
      }[dirFlag];
      const posName = dirFlag.toLocaleLowerCase();
      scrollSize.value = 0;

      if (instance.props.tabPosition === 'bottom') {
        instance.refs.hander && instance.refs.hander.before(instance.refs.content);
      } else {
        instance.refs.content && instance.refs.content.before(instance.refs.hander);
      }

      return {
        dirFlag,
        sizeName,
        textSizeName,
        posName,
        offsetName,
        scrollName
      };
    });
    const viewArea = vue.computed(() => {
      const {
        offsetName
      } = direction.value;
      return {
        start: Math.abs(scrollSize.value),
        end: Math.abs(scrollSize.value) + tabScroll.value[offsetName]
      };
    });
    vue.onUpdated(async () => {
      await vue.nextTick();
      const {
        sizeName,
        offsetName
      } = direction.value;
      let sizeSum = 0;
      tabElList.forEach(el => {
        const style = window.getComputedStyle(el);
        sizeSum += parseFloat(style[sizeName]);
      });
      scrollable.value = sizeSum > tabScroll.value[offsetName];
    });
    vue.watch(scrollSize, () => {
      const {
        dirFlag,
        offsetName
      } = direction.value;
      scrollSize.value = Math.min(scrollSize.value, 0);
      scrollSize.value = Math.max(scrollSize.value, tabScroll.value[offsetName] - tabNav.value[offsetName]);
      tabNav.value.style.transform = `translate${dirFlag}(${scrollSize.value}px)`;
    });

    const scrollToActive = item => {
      if (!scrollable.value) {
        return;
      }

      const {
        sizeName,
        posName,
        offsetName
      } = direction.value;
      scrollSize.value = (item[posName] + item[sizeName] / 2) * -1 + tabScroll.value[offsetName] / 2;
    };

    const handleClickLeft = () => {
      const {
        offsetName
      } = direction.value;
      scrollSize.value += tabScroll.value[offsetName];
    };

    const handleClickRight = () => {
      const {
        offsetName
      } = direction.value;
      scrollSize.value -= tabScroll.value[offsetName];
    };

    return {
      viewArea,
      scrollable,
      tabs,
      tabNav,
      tabScroll,
      direction,
      scrollToActive,
      handleClickLeft,
      handleClickRight
    };
  }

  const _hoisted_1$j = /*#__PURE__*/vue.createVNode("i", {
    class: "el-icon-plus"
  }, null, -1
  /* HOISTED */
  );

  const _hoisted_2$c = /*#__PURE__*/vue.createVNode("i", {
    class: "el-icon-arrow-left"
  }, null, -1
  /* HOISTED */
  );

  const _hoisted_3$a = /*#__PURE__*/vue.createVNode("i", {
    class: "el-icon-arrow-right"
  }, null, -1
  /* HOISTED */
  );

  const _hoisted_4$7 = {
    class: "el-tabs__nav-scroll",
    ref: "tabScroll"
  };
  const _hoisted_5$4 = {
    ref: "content",
    class: "el-tabs__content"
  };
  function render$p(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("div", {
      class: ["el-tabs", ['el-tabs--' + $props.tabPosition, {
        'el-tabs--card': $props.type === 'card',
        'el-tabs--border-card': $props.type === 'border-card'
      }]],
      ref: "tabs"
    }, [vue.createVNode("div", {
      ref: "hander",
      class: ["el-tabs__header", ['is-' + $props.tabPosition]]
    }, [$props.addable || $props.editable ? (vue.openBlock(), vue.createBlock("span", {
      key: 0,
      tabindex: "0",
      class: "el-tabs__new-tab",
      onClick: _cache[1] || (_cache[1] = $event => _ctx.$emit('edit', null, 'add'))
    }, [_hoisted_1$j])) : vue.createCommentVNode("v-if", true), vue.createVNode("div", {
      class: ["el-tabs__nav-wrap", ['is-' + $props.tabPosition, {
        'is-scrollable': _ctx.scrollable
      }]]
    }, [_ctx.scrollable ? (vue.openBlock(), vue.createBlock("span", {
      key: 0,
      class: "el-tabs__nav-prev",
      onClick: _cache[2] || (_cache[2] = (...args) => _ctx.handleClickLeft && _ctx.handleClickLeft(...args))
    }, [_hoisted_2$c])) : vue.createCommentVNode("v-if", true), _ctx.scrollable ? (vue.openBlock(), vue.createBlock("span", {
      key: 1,
      class: "el-tabs__nav-next",
      onClick: _cache[3] || (_cache[3] = (...args) => _ctx.handleClickRight && _ctx.handleClickRight(...args))
    }, [_hoisted_3$a])) : vue.createCommentVNode("v-if", true), vue.createVNode("div", _hoisted_4$7, [vue.createVNode("div", {
      class: ["el-tabs__nav", ['is-' + $props.tabPosition, {
        'is-stretch': $props.stretch && {
          top: true,
          bottom: true
        }[$props.tabPosition]
      }]],
      ref: "tabNav"
    }, [vue.createVNode("div", {
      class: ["el-tabs__active-bar", ['is-' + $props.tabPosition]],
      style: _ctx.activeBarStyle
    }, null, 6
    /* CLASS, STYLE */
    ), (vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList(_ctx.tabList, (item, index) => {
      return vue.openBlock(), vue.createBlock("div", {
        class: ["el-tabs__item is-closable", ['is-' + $props.tabPosition, {
          'is-active': index === _ctx.state.activeIndex,
          'is-closable': $props.closable || $props.editable || item.closable,
          'is-disabled': item.disabled
        }]],
        role: "tab",
        tabindex: "-1",
        ref: el => _ctx.tabElList[index] = el,
        key: item.name,
        onClick: $event => _ctx.handleClick(item, index, $event)
      }, [(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent({
        render: () => item.pane.slots.label && item.pane.slots.label()
      }))), vue.createTextVNode(" " + vue.toDisplayString(item.label) + " ", 1
      /* TEXT */
      ), $props.closable || $props.editable || item.closable ? (vue.openBlock(), vue.createBlock("span", {
        key: 0,
        class: "el-icon-close",
        onClick: vue.withModifiers($event => _ctx.handleClose(item, index, $event), ["stop"])
      }, null, 8
      /* PROPS */
      , ["onClick"])) : vue.createCommentVNode("v-if", true)], 10
      /* CLASS, PROPS */
      , ["onClick"]);
    }), 128
    /* KEYED_FRAGMENT */
    ))], 2
    /* CLASS */
    )], 512
    /* NEED_PATCH */
    )], 2
    /* CLASS */
    )], 2
    /* CLASS */
    ), vue.createVNode("div", _hoisted_5$4, [vue.renderSlot(_ctx.$slots, "default")], 512
    /* NEED_PATCH */
    )], 2
    /* CLASS */
    );
  }

  script$s.render = render$p;
  script$s.__file = "packages/tabs/Tabs.vue";

  /* istanbul ignore next */

  script$s.install = function (app) {
    app.component(script$s.name, script$s);
  };

  var script$r = {
    name: 'ElTabPane',
    props: {
      label: [String, Number],
      name: [String, Number],
      disabled: Boolean,
      closable: Boolean,
      lazy: Boolean
    },

    setup(props) {
      const index = vue.ref(0);
      const instance = vue.getCurrentInstance();
      const elTabsInfo = vue.inject('elTabsInfo', null);
      const tab = vue.reactive({
        label: props.label,
        name: props.name,
        disabled: props.disabled,
        closable: props.closable,
        rendered: false,
        pane: instance
      });

      if (!elTabsInfo) {
        console.error('Element: not find parent ETabs');
        return;
      }

      index.value = elTabsInfo.tabList.length;
      elTabsInfo.tabList[index.value] = tab;
      return {
        elTabsInfo,
        tab,
        index
      };
    }

  };

  const _hoisted_1$i = {
    key: 0
  };
  function render$o(_ctx, _cache, $props, $setup, $data, $options) {
    return ($props.lazy ? $setup.tab.rendered : true) ? vue.withDirectives((vue.openBlock(), vue.createBlock("div", _hoisted_1$i, [vue.renderSlot(_ctx.$slots, "default")], 512
    /* NEED_PATCH */
    )), [[vue.vShow, typeof $setup.elTabsInfo.props.modelValue !== 'undefined' ? $setup.elTabsInfo.state.activeName === $props.name : $setup.elTabsInfo.state.activeIndex === $setup.index]]) : vue.createCommentVNode("v-if", true);
  }

  script$r.render = render$o;
  script$r.__file = "packages/tab-pane/TabPane.vue";

  /* istanbul ignore next */

  script$r.install = function (app) {
    app.component(script$r.name, script$r);
  };

  var script$q = {
    name: 'ElBreadcrumb',
    props: {
      separator: {
        type: String,
        default: '/'
      },
      separatorClass: {
        type: String,
        default: ''
      }
    },

    setup(props) {
      const {
        separator,
        separatorClass
      } = vue.toRefs(props);
      const root = vue.ref(null);
      vue.provide('separator', separator);
      vue.provide('separatorClass', separatorClass);
      vue.onMounted(() => {
        const items = root.value.querySelectorAll('.el-breadcrumb__item');

        if (items.length) {
          items[items.length - 1].setAttribute('aria-current', 'page');
        }
      });
      return {
        root
      };
    }

  };

  const _hoisted_1$h = {
    ref: "root",
    class: "el-breadcrumb",
    "aria-label": "Breadcrumb",
    role: "navigation"
  };
  function render$n(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("div", _hoisted_1$h, [vue.renderSlot(_ctx.$slots, "default")], 512
    /* NEED_PATCH */
    );
  }

  script$q.render = render$n;
  script$q.__file = "packages/breadcrumb/Breadcrumb.vue";

  /* istanbul ignore next */

  script$q.install = function (app) {
    app.component(script$q.name, script$q);
  };

  var script$p = {
    name: 'ElBreadcrumbItem',
    props: {
      to: {},
      replace: Boolean
    },

    setup(props) {
      const {
        replace
      } = vue.toRefs(props);
      const separator = vue.inject('separator');
      const separatorClass = vue.inject('separatorClass');
      const link = vue.ref(null);
      const {
        proxy
      } = vue.getCurrentInstance();
      vue.onMounted(() => {
        link.value.setAttribute('role', 'link');
        link.value.addEventListener('click', () => {
          if (!props.to || !proxy.$router) return;
          replace ? proxy.$router.replace(props.to) : proxy.$router.push(props.to);
        });
      });
      return {
        separator,
        separatorClass,
        link
      };
    }

  };

  const _hoisted_1$g = {
    class: "el-breadcrumb__item"
  };
  const _hoisted_2$b = {
    key: 1,
    class: "el-breadcrumb__separator",
    role: "presentation"
  };
  function render$m(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("span", _hoisted_1$g, [vue.createVNode("span", {
      class: ['el-breadcrumb__inner', $props.to ? 'is-link' : ''],
      ref: "link",
      role: "link"
    }, [vue.renderSlot(_ctx.$slots, "default")], 2
    /* CLASS */
    ), $setup.separatorClass ? (vue.openBlock(), vue.createBlock("i", {
      key: 0,
      class: ["el-breadcrumb__separator", $setup.separatorClass]
    }, null, 2
    /* CLASS */
    )) : (vue.openBlock(), vue.createBlock("span", _hoisted_2$b, vue.toDisplayString($setup.separator), 1
    /* TEXT */
    ))]);
  }

  script$p.render = render$m;
  script$p.__file = "packages/breadcrumb/BreadcrumbItem.vue";

  /* istanbul ignore next */

  script$p.install = function (app) {
    app.component(script$p.name, script$p);
  };

  var script$o = {
    name: 'ElPageHeader',
    props: {
      title: {
        type: String,

        default() {
          return t('el.pageHeader.title');
        }

      },
      content: String
    },
    emits: ['back'],

    setup(props, ctx) {
      const handleClick = evt => {
        ctx.emit('back', evt);
      };

      return {
        handleClick
      };
    }

  };

  const _hoisted_1$f = {
    class: "el-page-header"
  };

  const _hoisted_2$a = /*#__PURE__*/vue.createVNode("i", {
    class: "el-icon-back"
  }, null, -1
  /* HOISTED */
  );

  const _hoisted_3$9 = {
    class: "el-page-header__title"
  };
  const _hoisted_4$6 = {
    class: "el-page-header__content"
  };
  function render$l(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("div", _hoisted_1$f, [vue.createVNode("div", {
      class: "el-page-header__left",
      onClick: _cache[1] || (_cache[1] = (...args) => $setup.handleClick && $setup.handleClick(...args))
    }, [_hoisted_2$a, vue.createVNode("div", _hoisted_3$9, [vue.renderSlot(_ctx.$slots, "title", {}, () => [vue.createTextVNode(vue.toDisplayString($props.title), 1
    /* TEXT */
    )])])]), vue.createVNode("div", _hoisted_4$6, [vue.renderSlot(_ctx.$slots, "content", {}, () => [vue.createTextVNode(vue.toDisplayString($props.content), 1
    /* TEXT */
    )])])]);
  }

  script$o.render = render$l;
  script$o.__file = "packages/page-header/PageHeader.vue";

  /* istanbul ignore next */

  script$o.install = function (app) {
    app.component(script$o.name, script$o);
  };

  function _isSlot(s) {
    return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !vue.isVNode(s);
  }

  var script$n = {
    name: 'ElDropdown',
    componentName: 'ElDropdown',
    directives: {
      Clickoutside
    },
    emits: ['menu-item-click', 'visible-change', 'command'],
    components: {
      ElButton: script$1u,
      ElButtonGroup: script$1t
    },

    provide() {
      return {
        dropdown: this
      };
    },

    props: {
      trigger: {
        type: String,
        default: 'hover'
      },
      type: String,
      size: {
        type: String,
        default: ''
      },
      splitButton: Boolean,
      hideOnClick: {
        type: Boolean,
        default: true
      },
      placement: {
        type: String,
        default: 'bottom-end'
      },
      visibleArrow: {
        default: true
      },
      showTimeout: {
        type: Number,
        default: 250
      },
      hideTimeout: {
        type: Number,
        default: 150
      },
      tabindex: {
        type: Number,
        default: 0
      }
    },

    setup(props, {
      emit,
      slots
    }) {
      const instance = vue.getCurrentInstance();
      const {
        size,
        trigger,
        showTimeout,
        tabindex,
        hideTimeout,
        hideOnClick,
        splitButton,
        type
      } = vue.toRefs(props);
      const dropdownSize = vue.computed(() => {
        var _instance$proxy, _instance$proxy$$ELEM;

        return size.value || ((_instance$proxy = instance.proxy) === null || _instance$proxy === void 0 ? void 0 : (_instance$proxy$$ELEM = _instance$proxy.$ELEMENT) === null || _instance$proxy$$ELEM === void 0 ? void 0 : _instance$proxy$$ELEM.size);
      });
      const timeout = vue.ref(0);
      const visible = vue.ref(false);
      const triggerElm = vue.ref(null);

      const show = () => {
        var _triggerElm$value;

        if ((_triggerElm$value = triggerElm.value) !== null && _triggerElm$value !== void 0 && _triggerElm$value.disabled) return;
        clearTimeout(timeout.value);
        timeout.value = setTimeout(() => {
          visible.value = true;
        }, trigger.value === 'click' ? 0 : showTimeout.value);
      };

      const hide = () => {
        var _triggerElm$value2;

        if ((_triggerElm$value2 = triggerElm.value) !== null && _triggerElm$value2 !== void 0 && _triggerElm$value2.disabled) return;
        removeTabindex();

        if (tabindex.value >= 0) {
          resetTabindex(triggerElm.value);
        }

        clearTimeout(timeout.value);
        timeout.value = setTimeout(() => {
          visible.value = false;
        }, trigger.value === 'click' ? 0 : hideTimeout.value);
      };

      const handleClick = () => {
        var _triggerElm$value3;

        if ((_triggerElm$value3 = triggerElm.value) !== null && _triggerElm$value3 !== void 0 && _triggerElm$value3.disabled) return;

        if (visible.value) {
          hide();
        } else {
          show();
        }
      };

      const menuItems = vue.ref(null);

      const handleTriggerKeyDown = ev => {
        const _keyCode = ev.keyCode;

        if ([38, 40].indexOf(_keyCode) > -1) {
          // up/down
          removeTabindex();
          resetTabindex(menuItems.value[0]);
          menuItems.value[0].focus();
          ev.preventDefault();
          ev.stopPropagation();
        } else if (_keyCode === 13) {
          // space enter选中
          handleClick();
        } else if ([9, 27].indexOf(_keyCode) > -1) {
          // tab || esc
          hide();
        }
      };

      const menuItemsArray = vue.ref(null);

      const handleItemKeyDown = ev => {
        const _keyCode = ev.keyCode;
        const _target = ev.target;

        const _currentIndex = menuItemsArray.value.indexOf(_target);

        const _max = menuItemsArray.value.length - 1;

        let _nextIndex;

        if ([38, 40].indexOf(_keyCode) > -1) {
          // up/down
          if (_keyCode === 38) {
            // up
            _nextIndex = _currentIndex !== 0 ? _currentIndex - 1 : 0;
          } else {
            // down
            _nextIndex = _currentIndex < _max ? _currentIndex + 1 : _max;
          }

          removeTabindex();
          resetTabindex(menuItems.value[_nextIndex]);

          menuItems.value[_nextIndex].focus();

          ev.preventDefault();
          ev.stopPropagation();
        } else if (_keyCode === 13) {
          // enter选中
          triggerElmFocus();

          _target.click();

          if (hideOnClick.value) {
            // click关闭
            visible.value = false;
          }
        } else if ([9, 27].indexOf(_keyCode) > -1) {
          // tab // esc
          hide();
          triggerElmFocus();
        }
      };

      const resetTabindex = ele => {
        // 下次tab时组件聚焦元素
        removeTabindex();
        ele.setAttribute('tabindex', '0'); // 下次期望的聚焦元素
      };

      const removeTabindex = () => {
        triggerElm.value.setAttribute('tabindex', '-1');
        menuItemsArray.value.forEach(item => {
          item.setAttribute('tabindex', '-1');
        });
      };

      const dropdownElm = vue.ref(null);
      const listId = vue.ref(`dropdown-menu-${generateId()}`);

      const initAria = () => {
        dropdownElm.value.setAttribute('id', listId.value);
        triggerElm.value.setAttribute('aria-haspopup', 'list');
        triggerElm.value.setAttribute('aria-controls', listId.value);

        if (!splitButton.value) {
          // 自定义
          triggerElm.value.setAttribute('role', 'button');
          triggerElm.value.setAttribute('tabindex', tabindex.value);
          triggerElm.value.setAttribute('class', (triggerElm.value.getAttribute('class') || '') + ' el-dropdown-selfdefine'); // 控制
        }
      };

      const focusing = vue.ref(false);

      const initEvent = () => {
        triggerElm.value = splitButton.value ? instance.proxy.$refs.trigger.$el : instance.proxy.$el.children[0];
        triggerElm.value.addEventListener('keydown', handleTriggerKeyDown); // triggerElm keydown

        dropdownElm.value.addEventListener('keydown', handleItemKeyDown, true); // item keydown
        // 控制自定义元素的样式

        if (!splitButton.value) {
          triggerElm.value.addEventListener('focus', () => {
            focusing.value = true;
          });
          triggerElm.value.addEventListener('blur', () => {
            focusing.value = false;
          });
          triggerElm.value.addEventListener('click', () => {
            focusing.value = false;
          });
        }

        if (trigger.value === 'hover') {
          triggerElm.value.addEventListener('mouseenter', show);
          triggerElm.value.addEventListener('mouseleave', hide);
          dropdownElm.value.addEventListener('mouseenter', show);
          dropdownElm.value.addEventListener('mouseleave', hide);
        } else if (trigger.value === 'click') {
          triggerElm.value.addEventListener('click', handleClick);
        }
      };

      const handleMenuItemClick = (command, instance) => {
        if (hideOnClick.value) {
          visible.value = false;
        }

        emit('command', command, instance);
      };

      const triggerElmFocus = () => {
        triggerElm.value.focus && triggerElm.value.focus();
      };

      const initDomOperation = () => {
        dropdownElm.value = instance.proxy.popperElm;
        menuItems.value = dropdownElm.value.querySelectorAll("[tabindex='-1']");
        menuItemsArray.value = [].slice.call(menuItems.value);
        initEvent();
        initAria();
      };

      const {
        broadcast,
        on
      } = useEmitter();
      vue.watch(visible, val => {
        broadcast('visible', val);
        emit('visible-change', val);
      });
      on('menu-item-click', handleMenuItemClick);
      vue.watch(focusing, val => {
        const selfDefine = instance.proxy.$el.querySelector('.el-dropdown-selfdefine');

        if (selfDefine) {
          // 自定义
          if (val) {
            selfDefine.className += ' focusing';
          } else {
            selfDefine.className = selfDefine.className.replace('focusing', '');
          }
        }
      });
      instance.proxy.initDomOperation = initDomOperation;
      instance.proxy.dropdownSize = dropdownSize.value;
      instance.proxy.visible = visible.value;
      instance.proxy.broadcast = broadcast;
      vue.provide('dropdown', instance);

      const handleMainButtonClick = event => {
        emit('click', event);
        hide();
      };

      return () => {
        const defaultNode = slots.default() ? slots.default()[0] : vue.h('span');
        const dropdownNode = slots.default() ? slots.default()[1] : vue.h('ul');
        const triggerElm = !splitButton.value ? defaultNode : vue.createVNode(vue.resolveComponent("el-button-group"), null, {
          default: () => [vue.createVNode(vue.resolveComponent("el-button"), {
            "type": type.value,
            "size": dropdownSize.value,
            "nativeOn-click": handleMainButtonClick
          }, _isSlot(defaultNode) ? defaultNode : {
            default: () => [defaultNode]
          }), vue.createVNode(vue.resolveComponent("el-button"), {
            "ref": "trigger",
            "type": type.value,
            "size": dropdownSize.value,
            "class": "el-dropdown__caret-button"
          }, {
            default: () => [vue.createVNode("i", {
              "class": "el-dropdown__icon el-icon-arrow-down"
            }, null)]
          })]
        }); // fixme: directive api not work
        // const vClickoutside = resolveDirective('clickoutside')
        //
        // return withDirectives(
        //   h('div', { class: 'el-dropdown' }, [triggerElm, slots.dropdown]),
        //   [vClickoutside, hide]
        // )

        return vue.h('div', {
          class: 'el-dropdown'
        }, [triggerElm, dropdownNode]);
      };
    }

  };

  script$n.__file = "packages/dropdown/src/dropdown.vue";

  /* istanbul ignore next */

  script$n.install = function (app) {
    app.component(script$n.name, script$n);
  };

  var script$m = {
    name: 'ElDropdownItem',
    props: {
      command: {},
      disabled: Boolean,
      divided: Boolean,
      icon: String
    },

    setup(props) {
      const instance = vue.getCurrentInstance();
      const {
        dispatch
      } = useEmitter();
      const {
        command
      } = vue.toRefs(props);

      const handleClick = () => {
        dispatch('menu-item-click', command === null || command === void 0 ? void 0 : command.value, instance.proxy);
      };

      return {
        handleClick
      };
    }

  };

  function render$k(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("li", {
      class: ["el-dropdown-menu__item", {
        'is-disabled': $props.disabled,
        'el-dropdown-menu__item--divided': $props.divided
      }],
      onClick: _cache[1] || (_cache[1] = (...args) => $setup.handleClick && $setup.handleClick(...args)),
      "aria-disabled": $props.disabled,
      tabindex: $props.disabled ? null : -1
    }, [$props.icon ? (vue.openBlock(), vue.createBlock("i", {
      key: 0,
      class: $props.icon
    }, null, 2
    /* CLASS */
    )) : vue.createCommentVNode("v-if", true), vue.renderSlot(_ctx.$slots, "default")], 10
    /* CLASS, PROPS */
    , ["aria-disabled", "tabindex"]);
  }

  script$m.render = render$k;
  script$m.__file = "packages/dropdown/src/dropdown-item.vue";

  /* istanbul ignore next */

  script$m.install = function (app) {
    app.component(script$m.name, script$m);
  };

  var script$l = {
    name: 'ElDropdownMenu',
    componentName: 'ElDropdownMenu',
    props: { ...popperProps,
      visibleArrow: {
        type: Boolean,
        default: true
      },
      arrowOffset: {
        type: Number,
        default: 0
      }
    },
    emits: ['updatePopper', 'visible', 'update:modelValue', 'created'],

    setup(props, {
      emit,
      slots
    }) {
      const popperElm = vue.ref(null);
      const referenceElm = vue.ref(null);
      const {
        doDestroy,
        showPopper,
        currentPlacement,
        updatePopper
      } = usePopper(props, {
        emit,
        slots
      }, {
        popperElm,
        referenceElm
      });
      const dropdown = vue.inject('dropdown');
      const size = dropdown.dropdownSize;
      const instance = vue.getCurrentInstance();
      const {
        on
      } = useEmitter();
      on('updatePopper', () => {
        if (showPopper.value) updatePopper();
      });
      on('visible', val => {
        showPopper.value = val;
      });
      vue.onMounted(() => {
        dropdown.popperElm = popperElm.value = instance.proxy.$el;
        referenceElm.value = dropdown.$el;
        vue.nextTick(() => dropdown.initDomOperation());
      });
      vue.watch(() => dropdown.placement, val => {
        currentPlacement.value = val;
      }, {
        immediate: true
      });
      vue.watch(() => dropdown.visible.value, val => {
        showPopper.value = val;
      });
      return {
        showPopper,
        size,
        doDestroy
      };
    }

  };

  function render$j(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock(vue.Transition, {
      name: "el-zoom-in-top",
      onAfterLeave: $setup.doDestroy
    }, {
      default: vue.withCtx(() => [vue.withDirectives(vue.createVNode("ul", {
        class: ["el-dropdown-menu el-popper", [$setup.size && `el-dropdown-menu--${$setup.size}`]]
      }, [vue.renderSlot(_ctx.$slots, "default")], 2
      /* CLASS */
      ), [[vue.vShow, $setup.showPopper]])]),
      _: 3
      /* FORWARDED */

    }, 8
    /* PROPS */
    , ["onAfterLeave"]);
  }

  script$l.render = render$j;
  script$l.__file = "packages/dropdown/src/dropdown-menu.vue";

  /* istanbul ignore next */

  script$l.install = function (app) {
    app.component(script$l.name, script$l);
  };

  /*
   * @Author: Mr Chang
   * @Date: 2020-08-30 13:09:21
   * @LastEditTime: 2020-09-02 11:17:04
   * @LastEditors: Mr Chang
   * @Description:
   * @FilePath: \element3\packages\steps\src\constants.js
   */
  const stateSymbol = Symbol('state');
  const propsSymbol = Symbol('props');

  var script$k = {
    name: 'ElSteps',
    props: {
      space: [Number, String],
      active: Number,
      direction: {
        type: String,
        default: 'horizontal'
      },
      alignCenter: Boolean,
      simple: Boolean,
      finishStatus: {
        type: String,
        default: 'finish'
      },
      processStatus: {
        type: String,
        default: 'process'
      }
    },
    emits: ['change'],

    setup(props, context) {
      const state = vue.reactive({
        steps: [],
        stepOffset: 0
      });
      vue.provide(stateSymbol, state);
      vue.provide(propsSymbol, props);
      vue.watch(() => props.active, (newVal, oldVal) => context.emit('change', newVal, oldVal));
      vue.watch(() => state.steps, () => {
        state.steps.forEach((child, index) => {
          child.state.index = index;
        });
      }, {
        deep: true
      });
      return { ...vue.toRefs(state)
      };
    }

  };

  function render$i(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("div", {
      class: ["el-steps", [!$props.simple && 'el-steps--' + $props.direction, $props.simple && 'el-steps--simple']]
    }, [vue.renderSlot(_ctx.$slots, "default")], 2
    /* CLASS */
    );
  }

  script$k.render = render$i;
  script$k.__file = "packages/steps/src/steps.vue";

  /* istanbul ignore next */

  script$k.install = function (app) {
    app.component(script$k.name, script$k);
  };

  var script$j = {
    name: 'ElStep',
    props: {
      title: String,
      icon: String,
      description: String,
      status: String
    },

    setup(props) {
      const parentState = vue.inject(stateSymbol);
      const steps = parentState.steps;
      const stepOffset = parentState.stepOffset;
      const parentProps = vue.inject(propsSymbol);
      const isSimple = parentProps.simple;
      const isCenter = parentProps.alignCenter;
      const state = vue.reactive({
        index: -1,
        lineStyle: {},
        internalStatus: ''
      });
      const currentStatus = vue.computed(() => {
        return props.status || state.internalStatus;
      });
      const prevStatus = vue.computed(() => {
        const prevStep = steps[state.index - 1];
        return prevStep ? prevStep.currentStatus : 'wait';
      });
      const isVertical = vue.computed(() => {
        return parentProps.direction === 'vertical';
      });
      const isLast = vue.computed(() => {
        return state.index === steps.length - 1;
      });
      const stepsCount = vue.computed(() => {
        return steps.length;
      });
      const space = vue.computed(() => {
        return isSimple ? '' : parentProps.space;
      });
      const style = vue.computed(() => {
        const style = {};
        const len = steps.length;
        const newSpace = typeof space.value === 'number' ? space.value + 'px' : space.value ? space.value : 100 / (len - (isCenter ? 0 : 1)) + '%';
        style.flexBasis = newSpace;
        if (isVertical.value) return style;

        if (isLast.value) {
          style.maxWidth = 100 / stepsCount.value + '%';
        } else {
          style.marginRight = -stepOffset + 'px';
        }

        return style;
      });

      const updateStatus = val => {
        if (state.index < 0) return;
        const prevChild = steps[state.index - 1];

        if (val > state.index) {
          state.internalStatus = parentProps.finishStatus;
        } else if (val === state.index && prevStatus.value !== 'error') {
          state.internalStatus = parentProps.processStatus;
        } else {
          state.internalStatus = 'wait';
        }

        if (prevChild) prevChild.calcProgress(state.internalStatus);
      };

      const calcProgress = status => {
        let step = 100;
        const style = {};
        style.transitionDelay = 150 * state.index + 'ms';

        if (status === parentProps.processStatus) {
          step = state.currentStatus !== 'error' ? 0 : 0;
        } else if (status === 'wait') {
          step = 0;
          style.transitionDelay = -150 * state.index + 'ms';
        }

        style.borderWidth = step && !isSimple ? '1px' : 0;
        parentProps.direction === 'vertical' ? style.height = step + '%' : style.width = step + '%';
        state.lineStyle = style;
      };

      vue.watch(() => state.index, () => {
        updateStatus(parentProps.active);
      }, {
        immediate: true
      });
      vue.watch(() => parentProps.active, updateStatus, {
        immediate: true
      });
      vue.watch(() => parentProps.processStatus, () => {
        updateStatus(parentProps.active);
      }, {
        immediate: true
      });
      const instance = {
        state,
        currentStatus,
        calcProgress,
        updateStatus
      };
      vue.onBeforeMount(() => {
        steps.push(instance);
      });
      vue.onBeforeUnmount(() => {
        const index = steps.indexOf(instance);

        if (index >= 0) {
          steps.splice(index, 1);
        }
      });
      return { ...vue.toRefs(state),
        currentStatus,
        prevStatus,
        direction: parentProps.direction,
        isSimple,
        isLast,
        isCenter,
        isVertical,
        space,
        style,
        stepOffset
      };
    }

  };

  const _hoisted_1$e = {
    key: 1,
    class: "el-step__icon-inner"
  };
  const _hoisted_2$9 = {
    class: "el-step__main"
  };
  const _hoisted_3$8 = {
    key: 0,
    class: "el-step__arrow"
  };
  function render$h(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("div", {
      ref: "step",
      class: ["el-step", [!$setup.isSimple && `is-${$setup.direction}`, $setup.isSimple && 'is-simple', $setup.isLast && !$setup.space && !$setup.isCenter && 'is-flex', $setup.isCenter && !$setup.isVertical && !$setup.isSimple && 'is-center']],
      style: $setup.style
    }, [vue.createCommentVNode(" icon & line "), vue.createVNode("div", {
      class: ["el-step__head", `is-${$setup.currentStatus}`]
    }, [vue.createVNode("div", {
      class: "el-step__line",
      style: $setup.isLast ? '' : {
        marginRight: $setup.stepOffset + 'px'
      }
    }, [vue.createVNode("i", {
      class: "el-step__line-inner",
      style: _ctx.lineStyle
    }, null, 4
    /* STYLE */
    )], 4
    /* STYLE */
    ), vue.createVNode("div", {
      class: ["el-step__icon", `is-${$props.icon ? 'icon' : 'text'}`]
    }, [$setup.currentStatus !== 'success' && $setup.currentStatus !== 'error' ? vue.renderSlot(_ctx.$slots, "icon", {
      key: 0
    }, () => [$props.icon ? (vue.openBlock(), vue.createBlock("i", {
      key: 0,
      class: ["el-step__icon-inner", [$props.icon]]
    }, null, 2
    /* CLASS */
    )) : vue.createCommentVNode("v-if", true), !$props.icon && !$setup.isSimple ? (vue.openBlock(), vue.createBlock("div", _hoisted_1$e, vue.toDisplayString(_ctx.index + 1), 1
    /* TEXT */
    )) : vue.createCommentVNode("v-if", true)]) : (vue.openBlock(), vue.createBlock("i", {
      key: 1,
      class: [['el-icon-' + ($setup.currentStatus === 'success' ? 'check' : 'close')], "el-step__icon-inner is-status"]
    }, null, 2
    /* CLASS */
    ))], 2
    /* CLASS */
    )], 2
    /* CLASS */
    ), vue.createCommentVNode(" title & description "), vue.createVNode("div", _hoisted_2$9, [vue.createVNode("div", {
      class: ["el-step__title", ['is-' + $setup.currentStatus]],
      ref: "title"
    }, [vue.renderSlot(_ctx.$slots, "title", {}, () => [vue.createTextVNode(vue.toDisplayString($props.title), 1
    /* TEXT */
    )])], 2
    /* CLASS */
    ), $setup.isSimple ? (vue.openBlock(), vue.createBlock("div", _hoisted_3$8)) : (vue.openBlock(), vue.createBlock("div", {
      key: 1,
      class: ["el-step__description", ['is-' + $setup.currentStatus]]
    }, [vue.renderSlot(_ctx.$slots, "description", {}, () => [vue.createTextVNode(vue.toDisplayString($props.description), 1
    /* TEXT */
    )])], 2
    /* CLASS */
    ))])], 6
    /* CLASS, STYLE */
    );
  }

  script$j.render = render$h;
  script$j.__file = "packages/steps/src/step.vue";

  /* istanbul ignore next */

  script$j.install = function (app) {
    app.component(script$j.name, script$j);
  };

  var script$i = {
    name: 'ElDialog',
    props: { ...popupProps,
      title: {
        type: String,
        default: ''
      },
      modal: {
        type: Boolean,
        default: true
      },
      modalAppendToBody: {
        type: Boolean,
        default: true
      },
      appendToBody: {
        type: Boolean,
        default: false
      },
      lockScroll: {
        type: Boolean,
        default: true
      },
      closeOnClickModal: {
        type: Boolean,
        default: true
      },
      closeOnPressEscape: {
        type: Boolean,
        default: true
      },
      showClose: {
        type: Boolean,
        default: true
      },
      width: String,
      fullscreen: Boolean,
      customClass: {
        type: String,
        default: ''
      },
      top: {
        type: String,
        default: '15vh'
      },
      beforeClose: Function,
      center: {
        type: Boolean,
        default: false
      },
      destroyOnClose: Boolean
    },
    emits: ['update:visible', 'close', 'opened', 'open', 'closed'],

    setup(props, {
      emit
    }) {
      const {
        visible,
        rendered,
        open
      } = usePopup(props);
      const {
        appendToBody,
        fullscreen,
        top,
        width,
        closeOnClickModal,
        destroyOnClose
      } = vue.toRefs(props);
      const closed = vue.ref(false);
      const key = vue.ref(0);
      const dialog = vue.ref(null);
      const instanc = vue.getCurrentInstance();
      const {
        broadcast
      } = useEmitter();
      const style = vue.computed(() => {
        const style = {};

        if (!(fullscreen && fullscreen.value)) {
          style.marginTop = top.value;

          if (width && width.value) {
            style.width = width.value;
          }
        }

        return style;
      });

      const handleWrapperClick = () => {
        if (!closeOnClickModal.value) return;
        handleClose();
      };

      const handleClose = () => {
        if (typeof props.beforeClose === 'function') {
          props.beforeClose(hide);
        } else {
          hide();
        }
      };

      const hide = cancel => {
        if (cancel !== false) {
          emit('update:visible', false);
          emit('close');
          closed.value = true;
        }
      };

      const updatePopper = () => {
        broadcast('updatePopper');
        broadcast('updatePopper');
      };

      const afterEnter = () => {
        emit('opened');
      };

      const afterLeave = () => {
        emit('closed');
      };

      vue.watch(visible, val => {
        const el = instanc.proxy.$el;

        if (val) {
          closed.value = false;
          emit('open');
          el.addEventListener('scroll', updatePopper);
          vue.nextTick(() => {
            dialog.value.scrollTop = 0;
          });

          if (appendToBody.value) {
            document.body.appendChild(el);
          }
        } else {
          el.removeEventListener('scroll', updatePopper);
          if (!closed.value) emit('close');

          if (destroyOnClose && destroyOnClose.value) {
            vue.nextTick(() => {
              key.value++;
            });
          }
        }
      });
      vue.onMounted(() => {
        if (visible.value) {
          rendered.value = true;
          open();

          if (appendToBody.value) {
            document.body.appendChild(instanc.proxy.$el);
          }
        }
      });
      vue.onUnmounted(() => {
        const el = instanc.proxy.$el;

        if (appendToBody.value && el && el.parentNode) {
          el.parentNode.removeChild(el);
        }
      });
      return {
        dialog,
        key,
        rendered,
        handleClose,
        style,
        handleWrapperClick,
        afterEnter,
        afterLeave
      };
    }

  };

  const _hoisted_1$d = {
    class: "el-dialog__header"
  };
  const _hoisted_2$8 = {
    class: "el-dialog__title"
  };

  const _hoisted_3$7 = /*#__PURE__*/vue.createVNode("i", {
    class: "el-dialog__close el-icon el-icon-close"
  }, null, -1
  /* HOISTED */
  );

  const _hoisted_4$5 = {
    key: 0,
    class: "el-dialog__body"
  };
  const _hoisted_5$3 = {
    key: 1,
    class: "el-dialog__footer"
  };
  function render$g(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock(vue.Transition, {
      name: "dialog-fade",
      onAfterEnter: $setup.afterEnter,
      onAfterLeave: $setup.afterLeave
    }, {
      default: vue.withCtx(() => [vue.withDirectives(vue.createVNode("div", {
        class: "el-dialog__wrapper",
        onClick: _cache[2] || (_cache[2] = vue.withModifiers((...args) => $setup.handleWrapperClick && $setup.handleWrapperClick(...args), ["self"]))
      }, [(vue.openBlock(), vue.createBlock("div", {
        role: "dialog",
        key: $setup.key,
        "aria-modal": "true",
        "aria-label": $props.title || 'dialog',
        class: ['el-dialog', {
          'is-fullscreen': $props.fullscreen,
          'el-dialog--center': $props.center
        }, $props.customClass],
        ref: "dialog",
        style: $setup.style
      }, [vue.createVNode("div", _hoisted_1$d, [vue.renderSlot(_ctx.$slots, "title", {}, () => [vue.createVNode("span", _hoisted_2$8, vue.toDisplayString($props.title), 1
      /* TEXT */
      )]), $props.showClose ? (vue.openBlock(), vue.createBlock("button", {
        key: 0,
        type: "button",
        class: "el-dialog__headerbtn",
        "aria-label": "Close",
        onClick: _cache[1] || (_cache[1] = (...args) => $setup.handleClose && $setup.handleClose(...args))
      }, [_hoisted_3$7])) : vue.createCommentVNode("v-if", true)]), $setup.rendered ? (vue.openBlock(), vue.createBlock("div", _hoisted_4$5, [vue.renderSlot(_ctx.$slots, "default")])) : vue.createCommentVNode("v-if", true), _ctx.$slots.footer ? (vue.openBlock(), vue.createBlock("div", _hoisted_5$3, [vue.renderSlot(_ctx.$slots, "footer")])) : vue.createCommentVNode("v-if", true)], 14
      /* CLASS, STYLE, PROPS */
      , ["aria-label"]))], 512
      /* NEED_PATCH */
      ), [[vue.vShow, _ctx.visible]])]),
      _: 3
      /* FORWARDED */

    }, 8
    /* PROPS */
    , ["onAfterEnter", "onAfterLeave"]);
  }

  script$i.render = render$g;
  script$i.__file = "packages/dialog/Dialog.vue";

  /* istanbul ignore next */

  script$i.install = function (app) {
    app.component(script$i.name, script$i);
  };

  /* fixme: deactivated暂时不知道映射哪钩子，没有加 */
  var script$h = {
    name: 'ElPopover',
    props: { ...vuePopperProps,
      trigger: {
        type: String,
        default: 'click',
        validator: value => ['click', 'focus', 'hover', 'manual'].indexOf(value) > -1
      },
      openDelay: {
        type: Number,
        default: 0
      },
      closeDelay: {
        type: Number,
        default: 200
      },
      title: String,
      disabled: Boolean,
      content: String,
      reference: {},
      popperClass: String,
      width: {},
      visibleArrow: {
        default: true
      },
      arrowOffset: {
        type: Number,
        default: 0
      },
      transition: {
        type: String,
        default: 'fade-in-linear'
      },
      tabindex: {
        type: Number,
        default: 0
      }
    },
    emits: ['created', 'show', 'hide', 'after-enter', 'after-leave', 'update:modelValue'],

    setup(props, {
      emit,
      slots
    }) {
      const {
        disabled,
        trigger,
        reference,
        popper,
        tabindex
      } = vue.toRefs(props);
      const instance = vue.getCurrentInstance();
      const referenceEl = vue.ref(null);
      const {
        showPopper,
        destroyPopper
      } = useVuePopper(props, {
        instance,
        emit,
        slots,
        referenceEl
      });
      const tooltipId = vue.computed(() => `el-popover-${generateId()}`);
      vue.watch(showPopper, val => {
        if (disabled.value) return;
        val ? emit('show') : emit('hide');
      });
      const {
        doToggle,
        doShow,
        doClose,
        handleFocus,
        handleClick,
        handleBlur,
        handleMouseEnter,
        handleKeydown,
        handleMouseLeave,
        handleDocumentClick,
        handleAfterEnter,
        handleAfterLeave,
        cleanup
      } = useInteractive({
        instance,
        emit,
        slots,
        referenceEl,
        showPopper,
        destroyPopper,
        ...vue.toRefs(props)
      });
      vue.onMounted(() => {
        referenceEl.value = reference && reference.value || instance.proxy.$refs.reference;
        const popperRef = popper && popper.value || instance.proxy.$refs.popper;

        if (!referenceEl.value && slots.reference && slots.reference()) {
          referenceEl.value = slots.reference()[0].el;
        } // 可访问性


        if (referenceEl.value) {
          addClass(referenceEl.value, 'el-popover__reference');
          referenceEl.value.setAttribute('aria-describedby', tooltipId.value);
          referenceEl.value.setAttribute('tabindex', tabindex.value); // tab序列

          popperRef.setAttribute('tabindex', 0);

          if (trigger.value !== 'click') {
            on(referenceEl.value, 'focusin', () => {
              handleFocus();
              const instanceRef = referenceEl.value.__vue__;

              if (instanceRef && typeof instanceRef.focus === 'function') {
                instanceRef.focus();
              }
            });
            on(popperRef, 'focusin', handleFocus);
            on(referenceEl.value, 'focusout', handleBlur);
            on(popperRef, 'focusout', handleBlur);
          }

          on(referenceEl.value, 'keydown', handleKeydown);
          on(referenceEl.value, 'click', handleClick);
        }

        if (trigger.value === 'click') {
          on(referenceEl.value, 'click', doToggle);
          on(document, 'click', handleDocumentClick);
        } else if (trigger.value === 'hover') {
          on(referenceEl.value, 'mouseenter', handleMouseEnter);
          on(popperRef, 'mouseenter', handleMouseEnter);
          on(referenceEl.value, 'mouseleave', handleMouseLeave);
          on(popperRef, 'mouseleave', handleMouseLeave);
        } else if (trigger.value === 'focus') {
          if (tabindex < 0) {
            console.warn('[Element Warn][Popover]a negative taindex means that the element cannot be focused by tab key');
          }

          if (referenceEl.value.querySelector('input, textarea')) {
            on(referenceEl.value, 'focusin', doShow);
            on(referenceEl.value, 'focusout', doClose);
          } else {
            on(referenceEl.value, 'mousedown', doShow);
            on(referenceEl.value, 'mouseup', doClose);
          }
        }
      });
      vue.onBeforeUnmount(() => {
        cleanup();
      });
      vue.onUnmounted(() => {
        off(referenceEl.value, 'click', doToggle);
        off(referenceEl.value, 'mouseup', doClose);
        off(referenceEl.value, 'mousedown', doShow);
        off(referenceEl.value, 'focusin', doShow);
        off(referenceEl.value, 'focusout', doClose);
        off(referenceEl.value, 'mousedown', doShow);
        off(referenceEl.value, 'mouseup', doClose);
        off(referenceEl.value, 'mouseleave', handleMouseLeave);
        off(referenceEl.value, 'mouseenter', handleMouseEnter);
        off(document, 'click', handleDocumentClick);
      }); // deactivated(() => {
      //   cleanup()
      // })

      return {
        showPopper,
        doToggle,
        doShow,
        doClose,
        handleFocus,
        handleClick,
        handleBlur,
        handleMouseEnter,
        handleKeydown,
        handleMouseLeave,
        handleDocumentClick,
        handleAfterEnter,
        handleAfterLeave,
        tooltipId,
        cleanup
      };
    }

  };

  function useInteractive({
    instance,
    showPopper,
    referenceEl,
    trigger,
    popper,
    slots,
    emit,
    destroyPopper,
    openDelay,
    closeDelay,
    reference
  }) {
    function doToggle() {
      showPopper.value = !showPopper.value;
    }

    function doShow() {
      showPopper.value = true;
    }

    function doClose() {
      showPopper.value = false;
    }

    function handleFocus() {
      addClass(referenceEl.value, 'focusing');
      if (trigger.value === 'click' || trigger.value === 'focus') showPopper.value = true;
    }

    function handleClick() {
      removeClass(referenceEl.value, 'focusing');
    }

    function handleBlur() {
      removeClass(referenceEl.value, 'focusing');
      if (trigger.value === 'click' || trigger.value === 'focus') showPopper.value = false;
    }

    let _timer = null;

    function handleMouseEnter() {
      clearTimeout(_timer);

      if (openDelay.value) {
        _timer = setTimeout(() => {
          showPopper.value = true;
        }, openDelay.value);
      } else {
        showPopper.value = true;
      }
    }

    function handleKeydown(ev) {
      if (ev.keyCode === 27 && trigger.value !== 'manual') {
        doClose();
      }
    }

    function handleMouseLeave() {
      clearTimeout(_timer);

      if (closeDelay.value) {
        _timer = setTimeout(() => {
          showPopper.value = false;
        }, closeDelay.value);
      } else {
        showPopper.value = false;
      }
    }

    function handleDocumentClick(e) {
      let referenceRef = reference && reference.value || instance.proxy.$refs.reference;
      const popperRef = popper && popper.value || instance.proxy.$refs.popper;
      const $el = instance.proxy.$el;

      if (!referenceRef && slots.reference && slots.reference() && slots.reference()[0]) {
        referenceRef = referenceEl = slots.reference()[0].el;
      }
      /* fixme: 在eleui官网调试是如下的判定条件 */


      if ($el && referenceRef && !$el.contains(e.target) && !referenceRef.contains(e.target) && popperRef && !popperRef.contains(e.target)) return showPopper.value = false;
    }

    function handleAfterEnter() {
      vue.nextTick(() => emit('after-enter'));
    }

    function handleAfterLeave() {
      vue.nextTick(() => {
        emit('after-leave');
        destroyPopper();
      });
    }

    function cleanup() {
      if (openDelay.value || closeDelay.value) {
        clearTimeout(_timer);
      }
    }

    return {
      doToggle,
      doShow,
      doClose,
      handleFocus,
      handleClick,
      handleBlur,
      handleMouseEnter,
      handleKeydown,
      handleMouseLeave,
      handleDocumentClick,
      handleAfterEnter,
      handleAfterLeave,
      cleanup
    };
  }

  const _hoisted_1$c = {
    ref: "reference"
  };
  function render$f(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("span", null, [vue.createVNode(vue.Transition, {
      name: $props.transition,
      onAfterEnter: $setup.handleAfterEnter,
      onAfterLeave: $setup.handleAfterLeave
    }, {
      default: vue.withCtx(() => [vue.withDirectives(vue.createVNode("div", {
        class: ["el-popover el-popper", [$props.popperClass, $props.content && 'el-popover--plain']],
        ref: "popper",
        style: {
          width: $props.width + 'px'
        },
        role: "tooltip",
        id: $setup.tooltipId,
        "aria-hidden": $props.disabled || !$setup.showPopper ? 'true' : 'false'
      }, [$props.title ? (vue.openBlock(), vue.createBlock("div", {
        key: 0,
        class: "el-popover__title",
        textContent: vue.toDisplayString($props.title)
      }, null, 8
      /* PROPS */
      , ["textContent"])) : vue.createCommentVNode("v-if", true), vue.renderSlot(_ctx.$slots, "default", {}, () => [vue.createTextVNode(vue.toDisplayString($props.content), 1
      /* TEXT */
      )])], 14
      /* CLASS, STYLE, PROPS */
      , ["id", "aria-hidden"]), [[vue.vShow, !$props.disabled && $setup.showPopper]])]),
      _: 3
      /* FORWARDED */

    }, 8
    /* PROPS */
    , ["name", "onAfterEnter", "onAfterLeave"]), vue.createVNode("span", _hoisted_1$c, [vue.renderSlot(_ctx.$slots, "reference")], 512
    /* NEED_PATCH */
    )]);
  }

  script$h.render = render$f;
  script$h.__file = "packages/popover/Popover.vue";

  const getReference = (el, binding, vnode) => {
    const _ref = binding.expression ? binding.value : binding.arg;

    const popper = vnode.context.$refs[_ref];

    if (popper) {
      if (Array.isArray(popper)) {
        popper[0].$refs.reference = el;
      } else {
        popper.$refs.reference = el;
      }
    }
  };
  /* directive 暂时测试不通过，待修复，目前调试看起来是directive没有正确的执行挂载导致的 */


  var directive = {
    beforeMount(el, binding, vnode) {
      console.log(el, binding);
      getReference(el, binding, vnode);
    },

    mounted(el, binding, vnode) {
      getReference(el, binding, vnode);
    }

  };

  /* istanbul ignore next */

  script$h.install = function (app) {
    app.directive('popover', directive);
    app.component(script$h.name, script$h);
  };

  var script$g = {
    name: 'ElPopconfirm',
    props: {
      title: {
        type: String
      },
      confirmButtonText: {
        type: String,
        default: t('el.popconfirm.confirmButtonText')
      },
      cancelButtonText: {
        type: String,
        default: t('el.popconfirm.cancelButtonText')
      },
      confirmButtonType: {
        type: String,
        default: 'primary'
      },
      cancelButtonType: {
        type: String,
        default: 'text'
      },
      icon: {
        type: String,
        default: 'el-icon-question'
      },
      iconColor: {
        type: String,
        default: '#f90'
      },
      hideIcon: {
        type: Boolean,
        default: false
      }
    },
    components: {
      ElPopover: script$h,
      ElButton: script$1u
    },
    emits: ['onConfirm', 'onCancel'],

    setup(props, {
      emit
    }) {
      const state = vue.reactive({
        visible: false
      });

      const confirm = () => {
        state.visible = false; // TODO 如果把 onConfirm 修改成 on-confirm 的话就涉及到 api 的变更了
        // 不过在发版之前可以讨论一波
        // eslint-disable-next-line vue/custom-event-name-casing

        emit('onConfirm');
      };

      const cancel = () => {
        state.visible = false; // eslint-disable-next-line vue/custom-event-name-casing

        emit('onCancel');
      };

      return { ...vue.toRefs(state),
        confirm,
        cancel
      };
    }

  };

  const _hoisted_1$b = {
    class: "el-popconfirm"
  };
  const _hoisted_2$7 = {
    class: "el-popconfirm__main"
  };
  const _hoisted_3$6 = {
    class: "el-popconfirm__action"
  };
  function render$e(_ctx, _cache, $props, $setup, $data, $options) {
    const _component_el_button = vue.resolveComponent("el-button");

    const _component_el_popover = vue.resolveComponent("el-popover");

    return vue.openBlock(), vue.createBlock(_component_el_popover, vue.mergeProps(_ctx.$attrs, {
      modelValue: _ctx.visible,
      "onUpdate:modelValue": _cache[1] || (_cache[1] = $event => _ctx.visible = $event),
      trigger: "click"
    }), {
      reference: vue.withCtx(() => [vue.renderSlot(_ctx.$slots, "reference")]),
      default: vue.withCtx(() => [vue.createVNode("div", _hoisted_1$b, [vue.createVNode("p", _hoisted_2$7, [!$props.hideIcon ? (vue.openBlock(), vue.createBlock("i", {
        key: 0,
        class: [$props.icon, "el-popconfirm__icon"],
        style: {
          color: $props.iconColor
        }
      }, null, 6
      /* CLASS, STYLE */
      )) : vue.createCommentVNode("v-if", true), vue.createTextVNode(" " + vue.toDisplayString($props.title), 1
      /* TEXT */
      )]), vue.createVNode("div", _hoisted_3$6, [vue.createVNode(_component_el_button, {
        size: "mini",
        type: $props.cancelButtonType,
        onClick: $setup.cancel
      }, {
        default: vue.withCtx(() => [vue.createTextVNode(vue.toDisplayString($props.cancelButtonText), 1
        /* TEXT */
        )]),
        _: 1
        /* STABLE */

      }, 8
      /* PROPS */
      , ["type", "onClick"]), vue.createVNode(_component_el_button, {
        size: "mini",
        type: $props.confirmButtonType,
        onClick: $setup.confirm
      }, {
        default: vue.withCtx(() => [vue.createTextVNode(vue.toDisplayString($props.confirmButtonText), 1
        /* TEXT */
        )]),
        _: 1
        /* STABLE */

      }, 8
      /* PROPS */
      , ["type", "onClick"])])])]),
      _: 1
      /* STABLE */

    }, 16
    /* FULL_PROPS */
    , ["modelValue"]);
  }

  script$g.render = render$e;
  script$g.__file = "packages/popconfirm/Popconfirm.vue";

  /* istanbul ignore next */

  script$g.install = function (app) {
    app.component(script$g.name, script$g);
  };

  const props = {
      header: String,
      bodyStyle: {
          type: Object,
          default: () => {
              return {
                  padding: '20px'
              };
          }
      },
      shadow: {
          type: String,
          default: 'always',
          validator(val) {
              return ['always', 'hover', 'never'].includes(val);
          }
      }
  };

  var script$f = vue.defineComponent({
    name: 'ElCard',
    props
  });

  const _hoisted_1$a = {
    key: 0,
    class: "el-card__header"
  };
  function render$d(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("div", {
      class: ["el-card", `is-${_ctx.shadow}-shadow`]
    }, [_ctx.$slots.header || _ctx.header ? (vue.openBlock(), vue.createBlock("div", _hoisted_1$a, [vue.renderSlot(_ctx.$slots, "header", {}, () => [vue.createTextVNode(vue.toDisplayString(_ctx.header), 1
    /* TEXT */
    )])])) : vue.createCommentVNode("v-if", true), vue.createVNode("div", {
      class: "el-card__body",
      style: _ctx.bodyStyle
    }, [vue.renderSlot(_ctx.$slots, "default")], 4
    /* STYLE */
    )], 2
    /* CLASS */
    );
  }

  script$f.render = render$d;
  script$f.__file = "src/components/Card/src/Card.vue";

  /* istanbul ignore next */

  script$f.install = function (app) {
    app.component(script$f.name, script$f);
  };

  var script$e = {
    name: 'ElCarousel',
    props: {
      initialIndex: {
        type: Number,
        default: 0
      },
      height: String,
      trigger: {
        type: String,
        default: 'hover'
      },
      autoplay: {
        type: Boolean,
        default: true
      },
      interval: {
        type: Number,
        default: 3000
      },
      indicatorPosition: String,
      indicator: {
        type: Boolean,
        default: true
      },
      arrow: {
        type: String,
        default: 'hover'
      },
      type: String,
      loop: {
        type: Boolean,
        default: true
      },
      direction: {
        type: String,
        default: 'horizontal',

        validator(val) {
          return ['horizontal', 'vertical'].indexOf(val) !== -1;
        }

      }
    },
    emits: ['change'],

    setup(props, {
      emit
    }) {
      // 初始化状态
      const initData = vue.reactive({
        items: [],
        activeIndex: -1,
        containerWidth: 0,
        timer: null,
        hover: false
      }); // 封装ArrowButton逻辑

      const {
        loop,
        arrowDisplay,
        handleButtonEnter,
        handleButtonLeave,
        throttledArrowClick,
        setActiveItem,
        resetItemPosition
      } = useArrowButton(props, initData); // 封装Indicator逻辑

      const {
        hasLabel,
        indicatorsClasses,
        throttledIndicatorHover,
        handleIndicatorClick
      } = useIndicator(props, initData); // 初始化Slide

      const {
        carouselClasses,
        handleMouseEnter,
        handleMouseLeave,
        startTimer
      } = useInitSlide(props, initData, loop);

      const updateItems = ElCarouselItem => {
        initData.items.push(ElCarouselItem);
      };

      const {
        addResizeListener,
        removeResizeListener
      } = useResizeEvent();
      vue.onMounted(() => {
        vue.nextTick(() => {
          addResizeListener(resetItemPosition);

          if (props.initialIndex < initData.items.length && props.initialIndex >= 0) {
            initData.activeIndex = props.initialIndex;
          }

          startTimer();
        });
      });
      vue.onUnmounted(() => {
        removeResizeListener(resetItemPosition);
      });
      vue.watch(() => initData.items, val => {
        if (val.length > 0) setActiveItem(props.initialIndex);
      });
      vue.watch(() => initData.activeIndex, (val, oldVal) => {
        resetItemPosition(oldVal);

        if (oldVal > -1) {
          emit('change', val, oldVal);
        }
      }); // 暴露方法

      const prev = () => {
        setActiveItem(initData.activeIndex - 1);
      };

      const next = () => {
        setActiveItem(initData.activeIndex + 1);
      }; // 取出视图所需参数


      const {
        items,
        activeIndex,
        hover
      } = vue.toRefs(initData);
      /**
       * 向CarouselItem提供属性及方法
       */
      // 通过computed将props中的direction字符串变成响应式

      const computedDirection = vue.computed(() => {
        return props.direction;
      });
      const computedType = vue.computed(() => {
        return props.type;
      });
      const computedItems = vue.computed(() => {
        return initData.items;
      });
      const computedItemLength = vue.computed(() => {
        return initData.items.length;
      });
      const computedLoop = vue.computed(() => {
        return props.loop;
      }); // 只提供计算出来的值，不允许子组件借此改变数据流向

      vue.provide('direction', computedDirection);
      vue.provide('type', computedType);
      vue.provide('items', computedItems);
      vue.provide('itemLength', computedItemLength);
      vue.provide('loop', computedLoop); // 提供改变状态的方法

      vue.provide('updateItems', updateItems);
      vue.provide('setActiveItem', setActiveItem);
      return {
        items,
        activeIndex,
        hover,
        arrowDisplay,
        handleButtonEnter,
        handleButtonLeave,
        throttledArrowClick,
        hasLabel,
        indicatorsClasses,
        throttledIndicatorHover,
        handleIndicatorClick,
        carouselClasses,
        handleMouseEnter,
        handleMouseLeave,
        prev,
        next,
        setActiveItem
      };
    }

  };

  const useArrowButton = (props, initData) => {
    const loop = vue.ref(props.loop);

    const itemInStage = (item, index) => {
      const length = initData.items.length;

      if (index === length - 1 && item.proxy.inStage && initData.items[0].active || item.proxy.inStage && initData.items[index + 1] && initData.items[index + 1].active) {
        return 'left';
      } else if (index === 0 && item.proxy.inStage && initData.items[length - 1].active || item.proxy.inStage && initData.items[index - 1] && initData.items[index - 1].active) {
        return 'right';
      }

      return false;
    };

    const resetItemPosition = oldIndex => {
      initData.items.forEach((item, index) => {
        item.proxy.translateItem(index, initData.activeIndex, oldIndex);
      });
    };

    const setActiveItem = index => {
      if (typeof index === 'string') {
        const filteredItems = initData.items.filter(item => item.proxy.name === index);

        if (filteredItems.length > 0) {
          index = initData.items.indexOf(filteredItems[0]);
        }
      }

      index = Number(index);

      if (isNaN(index) || index !== Math.floor(index)) {
        console.warn('[Element Warn][Carousel]index must be an integer.');
        return;
      }

      const length = initData.items.length;
      const oldIndex = initData.activeIndex;

      if (index < 0) {
        initData.activeIndex = loop.value ? length - 1 : 0;
      } else if (index >= length) {
        initData.activeIndex = loop.value ? 0 : length - 1;
      } else {
        initData.activeIndex = index;
      }

      if (oldIndex === initData.activeIndex) {
        resetItemPosition(oldIndex);
      }
    };

    const throttledArrowClick = throttle$1(300, true, index => {
      setActiveItem(index);
    });

    const handleButtonEnter = arrow => {
      if (props.direction === 'vertical') return;
      initData.items.forEach((item, index) => {
        if (arrow === itemInStage(item, index)) {
          item.proxy.hover = true;
        }
      });
    };

    const handleButtonLeave = () => {
      if (props.direction === 'vertical') return;
      initData.items.forEach(item => {
        item.proxy.hover = false;
      });
    };

    const arrowDisplay = vue.computed(() => {
      return props.arrow !== 'never' && props.direction !== 'vertical';
    });
    vue.watch(loop, () => {
      setActiveItem(initData.activeIndex);
    });
    return {
      loop,
      arrowDisplay,
      handleButtonEnter,
      handleButtonLeave,
      throttledArrowClick,
      setActiveItem,
      resetItemPosition
    };
  };

  const useIndicator = (props, initData) => {
    const handleIndicatorHover = index => {
      if (props.trigger === 'hover' && index !== initData.activeIndex) {
        initData.activeIndex = index;
      }
    };

    const throttledIndicatorHover = throttle$1(300, index => {
      handleIndicatorHover(index);
    });

    const handleIndicatorClick = index => {
      initData.activeIndex = index;
    };

    const hasLabel = vue.computed(() => {
      return initData.items.some(item => item.proxy.label.toString().length > 0);
    });
    const indicatorsClasses = vue.computed(() => {
      const classes = ['el-carousel__indicators', 'el-carousel__indicators--' + props.direction];

      if (hasLabel.value) {
        classes.push('el-carousel__indicators--labels');
      }

      if (props.indicatorPosition === 'outside' || props.type === 'card') {
        classes.push('el-carousel__indicators--outside');
      }

      return classes;
    });
    return {
      throttledIndicatorHover,
      handleIndicatorClick,
      hasLabel,
      indicatorsClasses
    };
  };

  const useInitSlide = (props, initData, loop) => {
    const autoplay = vue.ref(props.autoplay);

    const playSlides = () => {
      if (initData.activeIndex < initData.items.length - 1) {
        initData.activeIndex++;
      } else if (loop.value) {
        initData.activeIndex = 0;
      }
    };

    const startTimer = () => {
      if (props.interval <= 0 || !autoplay.value || initData.timer) return;
      initData.timer = setInterval(playSlides, props.interval);
    };

    const pauseTimer = () => {
      if (initData.timer) {
        clearInterval(initData.timer);
        initData.timer = null;
      }
    };

    const handleMouseEnter = () => {
      initData.hover = true;
      pauseTimer();
    };

    const handleMouseLeave = () => {
      initData.hover = false;
      startTimer();
    };

    const carouselClasses = vue.computed(() => {
      const classes = ['el-carousel', 'el-carousel--' + props.direction];

      if (initData.type === 'card') {
        classes.push('el-carousel--card');
      }

      return classes;
    });
    vue.watch(autoplay, val => {
      val ? startTimer() : pauseTimer();
    });
    return {
      carouselClasses,
      playSlides,
      startTimer,
      handleMouseEnter,
      handleMouseLeave
    };
  };

  const _hoisted_1$9 = /*#__PURE__*/vue.createVNode("i", {
    class: "el-icon-arrow-left"
  }, null, -1
  /* HOISTED */
  );

  const _hoisted_2$6 = /*#__PURE__*/vue.createVNode("i", {
    class: "el-icon-arrow-right"
  }, null, -1
  /* HOISTED */
  );

  const _hoisted_3$5 = {
    class: "el-carousel__button"
  };
  const _hoisted_4$4 = {
    key: 0
  };
  function render$c(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("div", {
      class: $setup.carouselClasses,
      onMouseenter: _cache[7] || (_cache[7] = vue.withModifiers((...args) => $setup.handleMouseEnter && $setup.handleMouseEnter(...args), ["stop"])),
      onMouseleave: _cache[8] || (_cache[8] = vue.withModifiers((...args) => $setup.handleMouseLeave && $setup.handleMouseLeave(...args), ["stop"]))
    }, [vue.createVNode("div", {
      class: "el-carousel__container",
      style: {
        height: $props.height
      }
    }, [$setup.arrowDisplay ? (vue.openBlock(), vue.createBlock(vue.Transition, {
      key: 0,
      name: "carousel-arrow-left"
    }, {
      default: vue.withCtx(() => [vue.withDirectives(vue.createVNode("button", {
        type: "button",
        onMouseenter: _cache[1] || (_cache[1] = $event => $setup.handleButtonEnter('left')),
        onMouseleave: _cache[2] || (_cache[2] = (...args) => $setup.handleButtonLeave && $setup.handleButtonLeave(...args)),
        onClick: _cache[3] || (_cache[3] = vue.withModifiers($event => $setup.throttledArrowClick($setup.activeIndex - 1), ["stop"])),
        class: "el-carousel__arrow el-carousel__arrow--left"
      }, [_hoisted_1$9], 544
      /* HYDRATE_EVENTS, NEED_PATCH */
      ), [[vue.vShow, ($props.arrow === 'always' || $setup.hover) && ($props.loop || $setup.activeIndex > 0)]])]),
      _: 1
      /* STABLE */

    })) : vue.createCommentVNode("v-if", true), $setup.arrowDisplay ? (vue.openBlock(), vue.createBlock(vue.Transition, {
      key: 1,
      name: "carousel-arrow-right"
    }, {
      default: vue.withCtx(() => [vue.withDirectives(vue.createVNode("button", {
        type: "button",
        onMouseenter: _cache[4] || (_cache[4] = $event => $setup.handleButtonEnter('right')),
        onMouseleave: _cache[5] || (_cache[5] = (...args) => $setup.handleButtonLeave && $setup.handleButtonLeave(...args)),
        onClick: _cache[6] || (_cache[6] = vue.withModifiers($event => $setup.throttledArrowClick($setup.activeIndex + 1), ["stop"])),
        class: "el-carousel__arrow el-carousel__arrow--right"
      }, [_hoisted_2$6], 544
      /* HYDRATE_EVENTS, NEED_PATCH */
      ), [[vue.vShow, ($props.arrow === 'always' || $setup.hover) && ($props.loop || $setup.activeIndex < $setup.items.length - 1)]])]),
      _: 1
      /* STABLE */

    })) : vue.createCommentVNode("v-if", true), vue.renderSlot(_ctx.$slots, "default")], 4
    /* STYLE */
    ), $props.indicatorPosition !== 'none' ? (vue.openBlock(), vue.createBlock("ul", {
      key: 0,
      class: $setup.indicatorsClasses
    }, [(vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList($setup.items, (item, index) => {
      return vue.openBlock(), vue.createBlock("li", {
        key: index,
        class: ['el-carousel__indicator', 'el-carousel__indicator--' + $props.direction, {
          'is-active': index === $setup.activeIndex
        }],
        onMouseenter: $event => $setup.throttledIndicatorHover(index),
        onClick: vue.withModifiers($event => $setup.handleIndicatorClick(index), ["stop"])
      }, [vue.createVNode("button", _hoisted_3$5, [$setup.hasLabel ? (vue.openBlock(), vue.createBlock("span", _hoisted_4$4, vue.toDisplayString(item.proxy.label), 1
      /* TEXT */
      )) : vue.createCommentVNode("v-if", true)])], 42
      /* CLASS, PROPS, HYDRATE_EVENTS */
      , ["onMouseenter", "onClick"]);
    }), 128
    /* KEYED_FRAGMENT */
    ))], 2
    /* CLASS */
    )) : vue.createCommentVNode("v-if", true)], 34
    /* CLASS, HYDRATE_EVENTS */
    );
  }

  script$e.render = render$c;
  script$e.__file = "packages/carousel/Carousel.vue";

  /* istanbul ignore next */

  script$e.install = function (app) {
    app.component(script$e.name, script$e);
  };

  const CARD_SCALE = 0.83;
  var script$d = {
    name: 'ElCarouselItem',
    props: {
      name: String,
      label: {
        type: [String, Number],
        default: ''
      }
    },

    setup() {
      const parentUpdateItems = vue.inject('updateItems');

      const _this = vue.getCurrentInstance(); // 更新父组件中的items


      vue.onMounted(() => {
        parentUpdateItems(_this);
      }); // 初始化data

      const initData = vue.reactive({
        hover: false,
        translate: 0,
        scale: 1,
        active: false,
        ready: false,
        inStage: false,
        animating: false
      });
      const {
        ready,
        active,
        inStage,
        hover,
        animating
      } = vue.toRefs(initData);
      const parentType = vue.inject('type'); // 处理translateItem，将方法返回到ctx中供父组件调用

      const {
        parentDirection,
        translateItem
      } = useTranslateItem(_this, initData, parentType); // 处理cardItemClick

      const {
        handleItemClick
      } = useCardItemClick(_this, parentType); // 处理样式

      const itemStyle = vue.computed(() => {
        const translateType = parentDirection.value === 'vertical' ? 'translateY' : 'translateX';
        const value = `${translateType}(${initData.translate}px) scale(${initData.scale})`;
        const style = {
          transform: value
        };
        return autoprefixer(style);
      }); // destoryed的时候更新父组件items

      vue.onUnmounted(() => {
        parentUpdateItems();
      });
      return {
        ready,
        active,
        inStage,
        hover,
        animating,
        itemStyle,
        handleItemClick,
        translateItem,
        parentType
      };
    }

  };

  const useTranslateItem = (_this, initData, parentType) => {
    const parentItemLength = vue.inject('itemLength');
    const parentDirection = vue.inject('direction');
    const parentLoop = vue.inject('loop');

    const processIndex = (index, activeIndex, length) => {
      if (activeIndex === 0 && index === length - 1) {
        return -1;
      } else if (activeIndex === length - 1 && index === 0) {
        return length;
      } else if (index < activeIndex - 1 && activeIndex - index >= length / 2) {
        return length + 1;
      } else if (index > activeIndex + 1 && index - activeIndex >= length / 2) {
        return -2;
      }

      return index;
    };

    const calcCardTranslate = (index, activeIndex) => {
      const parentWidth = _this.parent.vnode.el.offsetWidth;

      if (initData.inStage) {
        return parentWidth * ((2 - CARD_SCALE) * (index - activeIndex) + 1) / 4;
      } else if (index < activeIndex) {
        return -(1 + CARD_SCALE) * parentWidth / 4;
      } else {
        return (3 + CARD_SCALE) * parentWidth / 4;
      }
    };

    const calcTranslate = (index, activeIndex, isVertical) => {
      const distance = _this.parent.vnode.el[isVertical ? 'offsetHeight' : 'offsetWidth'];
      return distance * (index - activeIndex);
    };

    const translateItem = (index, activeIndex, oldIndex) => {
      const length = parentItemLength.value;

      if (parentType.value !== 'card' && oldIndex !== undefined) {
        initData.animating = index === activeIndex || index === oldIndex;
      }

      if (index !== activeIndex && length > 2 && parentLoop.value) {
        index = processIndex(index, activeIndex, length);
      }

      if (parentType.value === 'card') {
        if (parentDirection.value === 'vertical') {
          console.warn('[Element Warn][Carousel]vertical direction is not supported in card mode');
        }

        initData.inStage = Math.round(Math.abs(index - activeIndex)) <= 1;
        initData.active = index === activeIndex;
        initData.translate = calcCardTranslate(index, activeIndex);
        initData.scale = initData.active ? 1 : CARD_SCALE;
      } else {
        initData.active = index === activeIndex;
        const isVertical = parentDirection.value === 'vertical';
        initData.translate = calcTranslate(index, activeIndex, isVertical);
      }

      initData.ready = true;
    };

    return {
      parentDirection,
      translateItem
    };
  };

  const useCardItemClick = (_this, parentType) => {
    const parentItems = vue.inject('items');
    const setActiveItem = vue.inject('setActiveItem');

    const handleItemClick = () => {
      if (parentType.value === 'card') {
        const index = parentItems.value.indexOf(_this);
        setActiveItem(index);
      }
    };

    return {
      handleItemClick
    };
  };

  const _hoisted_1$8 = {
    key: 0,
    class: "el-carousel__mask"
  };
  function render$b(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.withDirectives((vue.openBlock(), vue.createBlock("div", {
      class: ["el-carousel__item", {
        'is-active': $setup.active,
        'el-carousel__item--card': $setup.parentType === 'card',
        'is-in-stage': $setup.inStage,
        'is-hover': $setup.hover,
        'is-animating': $setup.animating
      }],
      onClick: _cache[1] || (_cache[1] = (...args) => $setup.handleItemClick && $setup.handleItemClick(...args)),
      style: $setup.itemStyle
    }, [$setup.parentType === 'card' ? vue.withDirectives((vue.openBlock(), vue.createBlock("div", _hoisted_1$8, null, 512
    /* NEED_PATCH */
    )), [[vue.vShow, !$setup.active]]) : vue.createCommentVNode("v-if", true), vue.renderSlot(_ctx.$slots, "default")], 6
    /* CLASS, STYLE */
    )), [[vue.vShow, $setup.ready]]);
  }

  script$d.render = render$b;
  script$d.__file = "packages/carousel-item/CarouselItem.vue";

  /* istanbul ignore next */

  script$d.install = function (app) {
    app.component(script$d.name, script$d);
  };

  var script$c = {
    name: 'ElCollapse',
    componentName: 'ElCollapse',
    props: {
      accordion: Boolean,
      modelValue: {
        type: [Array, String, Number],

        default() {
          return [];
        }

      }
    },
    emits: ['update:modelValue', 'change'],

    setup(props, context) {
      const instance = vue.getCurrentInstance();
      const state = vue.reactive({
        activeNames: [].concat(props.modelValue)
      });
      vue.provide('collapse', instance);
      const {
        on
      } = useEmitter();
      vue.watch(() => props.modelValue, value => {
        state.activeNames = [].concat(value);
      });
      vue.onBeforeMount(() => {
        on('item-click', handleItemClick);
      });

      function setActiveNames(activeNames) {
        activeNames = [].concat(activeNames);
        const value = props.accordion ? activeNames[0] : activeNames;
        state.activeNames = activeNames;
        context.emit('update:modelValue', value);
        context.emit('change', value);
      }

      function handleItemClick(item) {
        const {
          name
        } = item;

        if (props.accordion) {
          setActiveNames((state.activeNames[0] || state.activeNames[0] === 0) && state.activeNames[0] === name ? '' : name);
        } else {
          const activeNames = state.activeNames.slice(0);
          const index = activeNames.indexOf(name);

          if (index > -1) {
            activeNames.splice(index, 1);
          } else {
            activeNames.push(name);
          }

          setActiveNames(activeNames);
        }
      }

      return { ...vue.toRefs(state),
        setActiveNames,
        handleItemClick
      };
    }

  };

  const _hoisted_1$7 = {
    class: "el-collapse",
    role: "tablist",
    "aria-multiselectable": "true"
  };
  function render$a(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("div", _hoisted_1$7, [vue.renderSlot(_ctx.$slots, "default")]);
  }

  script$c.render = render$a;
  script$c.__file = "packages/collapse/src/collapse.vue";

  /* istanbul ignore next */

  script$c.install = function (app) {
    app.component(script$c.name, script$c);
  };

  var script$b = {
    name: 'ElCollapseItem',
    componentName: 'ElCollapseItem',
    components: {
      ElCollapseTransition
    },
    props: {
      title: String,
      name: {
        type: [String, Number],

        default() {
          return '';
        }

      },
      disabled: Boolean
    },

    setup(props) {
      const state = vue.reactive({
        contentWrapStyle: {
          height: 'auto',
          display: 'block'
        },
        contentHeight: 0,
        focusing: false,
        isClick: false,
        id: generateId()
      });
      const instance = vue.getCurrentInstance();
      const collapse = vue.inject('collapse');
      const {
        dispatch
      } = useEmitter();
      const isActive = vue.computed(() => {
        const name = props.name || props.name === 0 ? props.name : instance.uid;
        return collapse.proxy.activeNames.indexOf(name) > -1;
      });

      function handleFocus() {
        setTimeout(() => {
          if (!state.isClick) {
            state.focusing = true;
          } else {
            state.isClick = false;
          }
        }, 50);
      }

      function handleHeaderClick() {
        if (props.disabled) return;
        const name = props.name || props.name === 0 ? props.name : instance.uid;
        dispatch('item-click', {
          name
        });
        state.focusing = false;
        state.isClick = true;
      }

      function handleEnterClick() {
        const name = props.name || props.name === 0 ? props.name : instance.uid;
        dispatch('item-click', {
          name
        });
      }

      return { ...vue.toRefs(state),
        isActive,
        handleFocus,
        handleHeaderClick,
        handleEnterClick
      };
    }

  };

  const _hoisted_1$6 = {
    class: "el-collapse-item__content"
  };
  function render$9(_ctx, _cache, $props, $setup, $data, $options) {
    const _component_el_collapse_transition = vue.resolveComponent("el-collapse-transition");

    return vue.openBlock(), vue.createBlock("div", {
      class: ["el-collapse-item", {
        'is-active': $setup.isActive,
        'is-disabled': $props.disabled
      }]
    }, [vue.createVNode("div", {
      role: "tab",
      "aria-expanded": $setup.isActive,
      "aria-controls": `el-collapse-content-${_ctx.id}`,
      "aria-describedby": `el-collapse-content-${_ctx.id}`
    }, [vue.createVNode("div", {
      class: ["el-collapse-item__header", {
        focusing: _ctx.focusing,
        'is-active': $setup.isActive
      }],
      onClick: _cache[1] || (_cache[1] = (...args) => $setup.handleHeaderClick && $setup.handleHeaderClick(...args)),
      role: "button",
      id: `el-collapse-head-${_ctx.id}`,
      tabindex: $props.disabled ? undefined : 0,
      onKeyup: _cache[2] || (_cache[2] = vue.withKeys(vue.withModifiers((...args) => $setup.handleEnterClick && $setup.handleEnterClick(...args), ["stop"]), ["space", "enter"])),
      onFocus: _cache[3] || (_cache[3] = (...args) => $setup.handleFocus && $setup.handleFocus(...args)),
      onBlur: _cache[4] || (_cache[4] = $event => _ctx.focusing = false)
    }, [vue.renderSlot(_ctx.$slots, "title", {}, () => [vue.createTextVNode(vue.toDisplayString($props.title), 1
    /* TEXT */
    )]), vue.createVNode("i", {
      class: ["el-collapse-item__arrow el-icon-arrow-right", {
        'is-active': $setup.isActive
      }]
    }, null, 2
    /* CLASS */
    )], 42
    /* CLASS, PROPS, HYDRATE_EVENTS */
    , ["id", "tabindex"])], 8
    /* PROPS */
    , ["aria-expanded", "aria-controls", "aria-describedby"]), vue.createVNode(_component_el_collapse_transition, null, {
      default: vue.withCtx(() => [vue.withDirectives(vue.createVNode("div", {
        class: "el-collapse-item__wrap",
        role: "tabpanel",
        "aria-hidden": !$setup.isActive,
        "aria-labelledby": `el-collapse-head-${_ctx.id}`,
        id: `el-collapse-content-${_ctx.id}`
      }, [vue.createVNode("div", _hoisted_1$6, [vue.renderSlot(_ctx.$slots, "default")])], 8
      /* PROPS */
      , ["aria-hidden", "aria-labelledby", "id"]), [[vue.vShow, $setup.isActive]])]),
      _: 3
      /* FORWARDED */

    })], 2
    /* CLASS */
    );
  }

  script$b.render = render$9;
  script$b.__file = "packages/collapse/src/collapse-item.vue";

  /* istanbul ignore next */

  script$b.install = function (app) {
    app.component(script$b.name, script$b);
  };

  var script$a = {
    name: 'ElTimeline',
    props: {
      reverse: {
        type: Boolean,
        default: false
      }
    },

    provide() {
      return {
        timeline: this
      };
    },

    render() {
      const reverse = this.reverse;
      const classes = {
        'el-timeline': true,
        'is-reverse': reverse
      };
      let slots;

      if (this.$slots.default) {
        slots = this.$slots.default();
        let children;

        if (slots.length > 0 && slots[0].type === vue.Fragment) {
          children = slots[0].children;
        } else {
          children = slots;
        }

        if (reverse) {
          children.reverse();
        }
      }

      return vue.createVNode("ul", {
        "class": classes
      }, [slots]);
    }

  };

  script$a.__file = "packages/timeline/Timeline.vue";

  /* istanbul ignore next */

  script$a.install = function (app) {
    app.component(script$a.name, script$a);
  };

  var script$9 = {
    name: 'ElTimelineItem',
    inject: ['timeline'],
    props: {
      timestamp: String,
      hideTimestamp: {
        type: Boolean,
        default: false
      },
      placement: {
        type: String,
        default: 'bottom'
      },
      type: String,
      color: String,
      size: {
        type: String,
        default: 'normal'
      },
      icon: String
    }
  };

  const _hoisted_1$5 = {
    class: "el-timeline-item"
  };

  const _hoisted_2$5 = /*#__PURE__*/vue.createVNode("div", {
    class: "el-timeline-item__tail"
  }, null, -1
  /* HOISTED */
  );

  const _hoisted_3$4 = {
    key: 1,
    class: "el-timeline-item__dot"
  };
  const _hoisted_4$3 = {
    class: "el-timeline-item__wrapper"
  };
  const _hoisted_5$2 = {
    key: 0,
    class: "el-timeline-item__timestamp is-top"
  };
  const _hoisted_6$2 = {
    class: "el-timeline-item__content"
  };
  const _hoisted_7$1 = {
    key: 1,
    class: "el-timeline-item__timestamp is-bottom"
  };
  function render$8(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("li", _hoisted_1$5, [_hoisted_2$5, !_ctx.$slots.dot ? (vue.openBlock(), vue.createBlock("div", {
      key: 0,
      class: ["el-timeline-item__node", [`el-timeline-item__node--${$props.size || ''}`, `el-timeline-item__node--${$props.type || ''}`]],
      style: {
        backgroundColor: $props.color
      }
    }, [$props.icon ? (vue.openBlock(), vue.createBlock("i", {
      key: 0,
      class: ["el-timeline-item__icon", $props.icon]
    }, null, 2
    /* CLASS */
    )) : vue.createCommentVNode("v-if", true)], 6
    /* CLASS, STYLE */
    )) : vue.createCommentVNode("v-if", true), _ctx.$slots.dot ? (vue.openBlock(), vue.createBlock("div", _hoisted_3$4, [vue.renderSlot(_ctx.$slots, "dot")])) : vue.createCommentVNode("v-if", true), vue.createVNode("div", _hoisted_4$3, [!$props.hideTimestamp && $props.placement === 'top' ? (vue.openBlock(), vue.createBlock("div", _hoisted_5$2, vue.toDisplayString($props.timestamp), 1
    /* TEXT */
    )) : vue.createCommentVNode("v-if", true), vue.createVNode("div", _hoisted_6$2, [vue.renderSlot(_ctx.$slots, "default")]), !$props.hideTimestamp && $props.placement === 'bottom' ? (vue.openBlock(), vue.createBlock("div", _hoisted_7$1, vue.toDisplayString($props.timestamp), 1
    /* TEXT */
    )) : vue.createCommentVNode("v-if", true)])]);
  }

  script$9.render = render$8;
  script$9.__file = "packages/timeline-item/TimelineItem.vue";

  /* istanbul ignore next */

  script$9.install = function (app) {
    app.component(script$9.name, script$9);
  };

  var script$8 = {
    name: 'ElDivider',
    props: {
      direction: {
        type: String,
        default: 'horizontal',

        validator(val) {
          return ['horizontal', 'vertical'].includes(val);
        }

      },
      contentPosition: {
        type: String,
        default: 'center',

        validator(val) {
          return ['left', 'center', 'right'].includes(val);
        }

      }
    }
  };

  function render$7(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock("div", vue.mergeProps(_ctx.$attrs, {
      class: ['el-divider', `el-divider--${$props.direction}`]
    }), [_ctx.$slots.default && $props.direction !== 'vertical' ? (vue.openBlock(), vue.createBlock("div", {
      key: 0,
      class: ['el-divider__text', `is-${$props.contentPosition}`]
    }, [vue.renderSlot(_ctx.$slots, "default")], 2
    /* CLASS */
    )) : vue.createCommentVNode("v-if", true)], 16
    /* FULL_PROPS */
    );
  }

  script$8.render = render$7;
  script$8.__file = "src/components/Divider/src/Divider.vue";

  /* istanbul ignore next */

  script$8.install = function (app) {
    app.component(script$8.name, script$8);
  };

  var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};

  function createCommonjsModule(fn) {
    var module = { exports: {} };
  	return fn(module, module.exports), module.exports;
  }

  /* Modified from https://github.com/taylorhakes/fecha
   *
   * The MIT License (MIT)
   *
   * Copyright (c) 2015 Taylor Hakes
   *
   * Permission is hereby granted, free of charge, to any person obtaining a copy
   * of this software and associated documentation files (the "Software"), to deal
   * in the Software without restriction, including without limitation the rights
   * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
   * copies of the Software, and to permit persons to whom the Software is
   * furnished to do so, subject to the following conditions:
   *
   *     The above copyright notice and this permission notice shall be included in all
   * copies or substantial portions of the Software.
   *
   *     THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
   * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
   *     FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
   * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
   * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
   *     OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
   * SOFTWARE.
   */

  var date = createCommonjsModule(function (module) {

  (function (main) {
    /**
     * Parse or format dates
     * @class fecha
     */

    var fecha = {};
    var token = /d{1,4}|M{1,4}|yy(?:yy)?|S{1,3}|Do|ZZ|([HhMsDm])\1?|[aA]|"[^"]*"|'[^']*'/g;
    var twoDigits = '\\d\\d?';
    var threeDigits = '\\d{3}';
    var fourDigits = '\\d{4}';
    var word = '[^\\s]+';
    var literal = /\[([^]*?)\]/gm;

    var noop = function () {};

    function regexEscape(str) {
      return str.replace(/[|\\{()[^$+*?.-]/g, '\\$&');
    }

    function shorten(arr, sLen) {
      var newArr = [];

      for (var i = 0, len = arr.length; i < len; i++) {
        newArr.push(arr[i].substr(0, sLen));
      }

      return newArr;
    }

    function monthUpdate(arrName) {
      return function (d, v, i18n) {
        var index = i18n[arrName].indexOf(v.charAt(0).toUpperCase() + v.substr(1).toLowerCase());

        if (~index) {
          d.month = index;
        }
      };
    }

    function pad(val, len) {
      val = String(val);
      len = len || 2;

      while (val.length < len) {
        val = '0' + val;
      }

      return val;
    }

    var dayNames = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
    var monthNames = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
    var monthNamesShort = shorten(monthNames, 3);
    var dayNamesShort = shorten(dayNames, 3);
    fecha.i18n = {
      dayNamesShort: dayNamesShort,
      dayNames: dayNames,
      monthNamesShort: monthNamesShort,
      monthNames: monthNames,
      amPm: ['am', 'pm'],
      DoFn: function DoFn(D) {
        return D + ['th', 'st', 'nd', 'rd'][D % 10 > 3 ? 0 : (D - D % 10 !== 10) * D % 10];
      }
    };
    var formatFlags = {
      D: function (dateObj) {
        return dateObj.getDay();
      },
      DD: function (dateObj) {
        return pad(dateObj.getDay());
      },
      Do: function (dateObj, i18n) {
        return i18n.DoFn(dateObj.getDate());
      },
      d: function (dateObj) {
        return dateObj.getDate();
      },
      dd: function (dateObj) {
        return pad(dateObj.getDate());
      },
      ddd: function (dateObj, i18n) {
        return i18n.dayNamesShort[dateObj.getDay()];
      },
      dddd: function (dateObj, i18n) {
        return i18n.dayNames[dateObj.getDay()];
      },
      M: function (dateObj) {
        return dateObj.getMonth() + 1;
      },
      MM: function (dateObj) {
        return pad(dateObj.getMonth() + 1);
      },
      MMM: function (dateObj, i18n) {
        return i18n.monthNamesShort[dateObj.getMonth()];
      },
      MMMM: function (dateObj, i18n) {
        return i18n.monthNames[dateObj.getMonth()];
      },
      yy: function (dateObj) {
        return pad(String(dateObj.getFullYear()), 4).substr(2);
      },
      yyyy: function (dateObj) {
        return pad(dateObj.getFullYear(), 4);
      },
      h: function (dateObj) {
        return dateObj.getHours() % 12 || 12;
      },
      hh: function (dateObj) {
        return pad(dateObj.getHours() % 12 || 12);
      },
      H: function (dateObj) {
        return dateObj.getHours();
      },
      HH: function (dateObj) {
        return pad(dateObj.getHours());
      },
      m: function (dateObj) {
        return dateObj.getMinutes();
      },
      mm: function (dateObj) {
        return pad(dateObj.getMinutes());
      },
      s: function (dateObj) {
        return dateObj.getSeconds();
      },
      ss: function (dateObj) {
        return pad(dateObj.getSeconds());
      },
      S: function (dateObj) {
        return Math.round(dateObj.getMilliseconds() / 100);
      },
      SS: function (dateObj) {
        return pad(Math.round(dateObj.getMilliseconds() / 10), 2);
      },
      SSS: function (dateObj) {
        return pad(dateObj.getMilliseconds(), 3);
      },
      a: function (dateObj, i18n) {
        return dateObj.getHours() < 12 ? i18n.amPm[0] : i18n.amPm[1];
      },
      A: function (dateObj, i18n) {
        return dateObj.getHours() < 12 ? i18n.amPm[0].toUpperCase() : i18n.amPm[1].toUpperCase();
      },
      ZZ: function (dateObj) {
        var o = dateObj.getTimezoneOffset();
        return (o > 0 ? '-' : '+') + pad(Math.floor(Math.abs(o) / 60) * 100 + Math.abs(o) % 60, 4);
      }
    };
    var parseFlags = {
      d: [twoDigits, function (d, v) {
        d.day = v;
      }],
      Do: [twoDigits + word, function (d, v) {
        d.day = parseInt(v, 10);
      }],
      M: [twoDigits, function (d, v) {
        d.month = v - 1;
      }],
      yy: [twoDigits, function (d, v) {
        var da = new Date(),
            cent = +('' + da.getFullYear()).substr(0, 2);
        d.year = '' + (v > 68 ? cent - 1 : cent) + v;
      }],
      h: [twoDigits, function (d, v) {
        d.hour = v;
      }],
      m: [twoDigits, function (d, v) {
        d.minute = v;
      }],
      s: [twoDigits, function (d, v) {
        d.second = v;
      }],
      yyyy: [fourDigits, function (d, v) {
        d.year = v;
      }],
      S: ['\\d', function (d, v) {
        d.millisecond = v * 100;
      }],
      SS: ['\\d{2}', function (d, v) {
        d.millisecond = v * 10;
      }],
      SSS: [threeDigits, function (d, v) {
        d.millisecond = v;
      }],
      D: [twoDigits, noop],
      ddd: [word, noop],
      MMM: [word, monthUpdate('monthNamesShort')],
      MMMM: [word, monthUpdate('monthNames')],
      a: [word, function (d, v, i18n) {
        var val = v.toLowerCase();

        if (val === i18n.amPm[0]) {
          d.isPm = false;
        } else if (val === i18n.amPm[1]) {
          d.isPm = true;
        }
      }],
      ZZ: ['[^\\s]*?[\\+\\-]\\d\\d:?\\d\\d|[^\\s]*?Z', function (d, v) {
        var parts = (v + '').match(/([+-]|\d\d)/gi),
            minutes;

        if (parts) {
          minutes = +(parts[1] * 60) + parseInt(parts[2], 10);
          d.timezoneOffset = parts[0] === '+' ? minutes : -minutes;
        }
      }]
    };
    parseFlags.dd = parseFlags.d;
    parseFlags.dddd = parseFlags.ddd;
    parseFlags.DD = parseFlags.D;
    parseFlags.mm = parseFlags.m;
    parseFlags.hh = parseFlags.H = parseFlags.HH = parseFlags.h;
    parseFlags.MM = parseFlags.M;
    parseFlags.ss = parseFlags.s;
    parseFlags.A = parseFlags.a; // Some common format strings

    fecha.masks = {
      default: 'ddd MMM dd yyyy HH:mm:ss',
      shortDate: 'M/D/yy',
      mediumDate: 'MMM d, yyyy',
      longDate: 'MMMM d, yyyy',
      fullDate: 'dddd, MMMM d, yyyy',
      shortTime: 'HH:mm',
      mediumTime: 'HH:mm:ss',
      longTime: 'HH:mm:ss.SSS'
    };
    /***
     * Format a date
     * @method format
     * @param {Date|number} dateObj
     * @param {string} mask Format of the date, i.e. 'mm-dd-yy' or 'shortDate'
     */

    fecha.format = function (dateObj, mask, i18nSettings) {
      var i18n = i18nSettings || fecha.i18n;

      if (typeof dateObj === 'number') {
        dateObj = new Date(dateObj);
      }

      if (Object.prototype.toString.call(dateObj) !== '[object Date]' || isNaN(dateObj.getTime())) {
        throw new Error('Invalid Date in fecha.format');
      }

      mask = fecha.masks[mask] || mask || fecha.masks['default'];
      var literals = []; // Make literals inactive by replacing them with ??

      mask = mask.replace(literal, function ($0, $1) {
        literals.push($1);
        return '@@@';
      }); // Apply formatting rules

      mask = mask.replace(token, function ($0) {
        return $0 in formatFlags ? formatFlags[$0](dateObj, i18n) : $0.slice(1, $0.length - 1);
      }); // Inline literal values back into the formatted value

      return mask.replace(/@@@/g, function () {
        return literals.shift();
      });
    };
    /**
     * Parse a date string into an object, changes - into /
     * @method parse
     * @param {string} dateStr Date string
     * @param {string} format Date parse format
     * @returns {Date|boolean}
     */


    fecha.parse = function (dateStr, format, i18nSettings) {
      var i18n = i18nSettings || fecha.i18n;

      if (typeof format !== 'string') {
        throw new Error('Invalid format in fecha.parse');
      }

      format = fecha.masks[format] || format; // Avoid regular expression denial of service, fail early for really long strings
      // https://www.owasp.org/index.php/Regular_expression_Denial_of_Service_-_ReDoS

      if (dateStr.length > 1000) {
        return null;
      }

      var dateInfo = {};
      var parseInfo = [];
      var literals = [];
      format = format.replace(literal, function ($0, $1) {
        literals.push($1);
        return '@@@';
      });
      var newFormat = regexEscape(format).replace(token, function ($0) {
        if (parseFlags[$0]) {
          var info = parseFlags[$0];
          parseInfo.push(info[1]);
          return '(' + info[0] + ')';
        }

        return $0;
      });
      newFormat = newFormat.replace(/@@@/g, function () {
        return literals.shift();
      });
      var matches = dateStr.match(new RegExp(newFormat, 'i'));

      if (!matches) {
        return null;
      }

      for (var i = 1; i < matches.length; i++) {
        parseInfo[i - 1](dateInfo, matches[i], i18n);
      }

      var today = new Date();

      if (dateInfo.isPm === true && dateInfo.hour != null && +dateInfo.hour !== 12) {
        dateInfo.hour = +dateInfo.hour + 12;
      } else if (dateInfo.isPm === false && +dateInfo.hour === 12) {
        dateInfo.hour = 0;
      }

      var date;

      if (dateInfo.timezoneOffset != null) {
        dateInfo.minute = +(dateInfo.minute || 0) - +dateInfo.timezoneOffset;
        date = new Date(Date.UTC(dateInfo.year || today.getFullYear(), dateInfo.month || 0, dateInfo.day || 1, dateInfo.hour || 0, dateInfo.minute || 0, dateInfo.second || 0, dateInfo.millisecond || 0));
      } else {
        date = new Date(dateInfo.year || today.getFullYear(), dateInfo.month || 0, dateInfo.day || 1, dateInfo.hour || 0, dateInfo.minute || 0, dateInfo.second || 0, dateInfo.millisecond || 0);
      }

      return date;
    };
    /* istanbul ignore next */


    if (module.exports) {
      module.exports = fecha;
    } else {
      main.fecha = fecha;
    }
  })(commonjsGlobal);
  });

  const weeks = ['sun', 'mon', 'tue', 'wed', 'thu', 'fri', 'sat'];
  const months = ['jan', 'feb', 'mar', 'apr', 'may', 'jun', 'jul', 'aug', 'sep', 'oct', 'nov', 'dec'];

  const getI18nSettings = () => {
    return {
      dayNamesShort: weeks.map(week => t(`el.datepicker.weeks.${week}`)),
      dayNames: weeks.map(week => t(`el.datepicker.weeks.${week}`)),
      monthNamesShort: months.map(month => t(`el.datepicker.months.${month}`)),
      monthNames: months.map((month, index) => t(`el.datepicker.month${index + 1}`)),
      amPm: ['am', 'pm']
    };
  };
  const getFirstDayOfMonth = function (date) {
    const temp = new Date(date.getTime());
    temp.setDate(1);
    return temp.getDay();
  }; // see: https://stackoverflow.com/questions/3674539/incrementing-a-date-in-javascript
  const getPrevMonthLastDays = (date, amount) => {
    if (amount <= 0) return [];
    const temp = new Date(date.getTime());
    temp.setDate(0);
    const lastDay = temp.getDate();
    return range(amount).map((_, index) => lastDay - (amount - index - 1));
  };
  const getMonthDays = date => {
    const temp = new Date(date.getFullYear(), date.getMonth() + 1, 0);
    const days = temp.getDate();
    return range(days).map((_, index) => index + 1);
  };
  const range = function (n) {
    // see https://stackoverflow.com/questions/3746725/create-a-javascript-array-containing-1-n
    return Array.apply(null, {
      length: n
    }).map((_, n) => n);
  };
  const validateRangeInOneMonth = function (start, end) {
    return start.getMonth() === end.getMonth() && start.getFullYear() === end.getFullYear();
  };

  var script$7 = {
    props: {
      selectedDay: String,
      // formated date yyyy-MM-dd
      range: {
        type: Array,

        validator(val) {
          if (!(val && val.length)) return true;
          const [start, end] = val;
          return validateRangeInOneMonth(start, end);
        }

      },
      date: Date,
      hideHeader: Boolean,
      firstDayOfWeek: Number
    },

    setup(props, {
      emit
    }) {
      const {
        selectedDay,
        date: date$1,
        hideHeader,
        firstDayOfWeek
      } = vue.toRefs(props);
      const WEEK_DAYS = vue.ref(getI18nSettings().dayNames);
      const elCalendar = vue.inject('elCalendar'); // methods

      const toNestedArr = days => {
        return range(days.length / 7).map((_, index) => {
          const start = index * 7;
          return days.slice(start, start + 7);
        });
      };

      const getFormateDate = (day, type) => {
        if (!day || ['prev', 'current', 'next'].indexOf(type) === -1) {
          throw new Error('invalid day or type');
        }

        let prefix = curMonthDatePrefix.value;

        if (type === 'prev') {
          prefix = prevMonthDatePrefix.value;
        } else if (type === 'next') {
          prefix = nextMonthDatePrefix.value;
        }

        day = `00${day}`.slice(-2);
        return `${prefix}-${day}`;
      };

      const getCellClass = ({
        text,
        type
      }) => {
        const classes = [type];

        if (type === 'current') {
          const date = getFormateDate(text, type);

          if (date === selectedDay.value) {
            classes.push('is-selected');
          }

          if (date === formatedToday.value) {
            classes.push('is-today');
          }
        }

        return classes;
      };

      const pickDay = ({
        text,
        type
      }) => {
        const date = getFormateDate(text, type);
        emit('pick', date);
      };

      const cellRenderProxy = ({
        text,
        type
      }) => {
        const render = elCalendar.slots.default;
        if (!render) return vue.createVNode("span", null, [text]);
        const day = getFormateDate(text, type);
        const date = new Date(day);
        const data = {
          isSelected: selectedDay.value === day,
          type: `${type}-month`,
          day
        };
        return render({
          date,
          data
        });
      }; // computed


      const prevMonthDatePrefix = vue.computed(() => {
        const temp = new Date(date$1.value.getTime());
        temp.setDate(0);
        return date.format(temp, 'yyyy-MM');
      });
      const curMonthDatePrefix = vue.computed(() => {
        return date.format(date$1.value, 'yyyy-MM');
      });
      const nextMonthDatePrefix = vue.computed(() => {
        const temp = new Date(date$1.value.getFullYear(), date$1.value.getMonth() + 1, 1);
        return date.format(temp, 'yyyy-MM');
      });
      const formatedToday = vue.computed(() => {
        return elCalendar.formatedToday;
      });
      const isInRange = vue.computed(() => {
        return props.range && props.range.length;
      });
      const rows = vue.computed(() => {
        let days = []; // if range exists, should render days in range.

        if (isInRange.value) {
          const [start, end] = props.range;
          const currentMonthRange = range(end.getDate() - start.getDate() + 1).map((_, index) => ({
            text: start.getDate() + index,
            type: 'current'
          }));
          let remaining = currentMonthRange.length % 7;
          remaining = remaining === 0 ? 0 : 7 - remaining;
          const nextMonthRange = range(remaining).map((_, index) => ({
            text: index + 1,
            type: 'next'
          }));
          days = currentMonthRange.concat(nextMonthRange);
        } else {
          let firstDay = getFirstDayOfMonth(date$1.value);
          firstDay = firstDay === 0 ? 7 : firstDay;

          const _firstDayOfWeek = typeof firstDayOfWeek.value === 'number' ? firstDayOfWeek.value : 1;

          const prevMonthDays = getPrevMonthLastDays(date$1.value, firstDay - _firstDayOfWeek).map(day => ({
            text: day,
            type: 'prev'
          }));
          const currentMonthDays = getMonthDays(date$1.value).map(day => ({
            text: day,
            type: 'current'
          }));
          days = [...prevMonthDays, ...currentMonthDays];
          const nextMonthDays = range(42 - days.length).map((_, index) => ({
            text: index + 1,
            type: 'next'
          }));
          days = days.concat(nextMonthDays);
        }

        return toNestedArr(days);
      });
      const weekDays = vue.computed(() => {
        const start = firstDayOfWeek.value;

        if (typeof start !== 'number' || start === 0) {
          return WEEK_DAYS.value.slice();
        } else {
          return WEEK_DAYS.value.slice(start).concat(WEEK_DAYS.value.slice(0, start));
        }
      });
      return () => {
        const instance = vue.getCurrentInstance();
        const thead = hideHeader.value ? null : vue.createVNode("thead", null, [weekDays.value.map(day => vue.createVNode("th", {
          "key": day
        }, [day]))]);
        return vue.createVNode("table", {
          "class": {
            'el-calendar-table': true,
            'is-range': isInRange.value
          },
          "cellspacing": "0",
          "cellpadding": "0"
        }, [thead, vue.createVNode("tbody", null, [rows.value.map((row, index) => vue.createVNode("tr", {
          "class": {
            'el-calendar-table__row': true,
            'el-calendar-table__row--hide-border': index === 0 && hideHeader.value
          },
          "key": index
        }, [row.map((cell, key) => vue.createVNode("td", {
          "key": key,
          "class": getCellClass(cell),
          "onClick": pickDay.bind(instance, cell)
        }, [vue.createVNode("div", {
          "class": "el-calendar-day"
        }, [cellRenderProxy(cell)])]))]))])]);
      };
    }

  };

  script$7.__file = "packages/calendar/DateTable.vue";

  const validTypes = ['prev-month', 'today', 'next-month'];
  const weekDays = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
  const oneDay = 86400000;
  var script$6 = {
    name: 'ElCalendar',
    components: {
      DateTable: script$7,
      ElButton: script$1u,
      ElButtonGroup: script$1t
    },
    props: {
      modelValue: [Date, String, Number],
      range: {
        type: Array,

        validator(range) {
          if (Array.isArray(range)) {
            return range.length === 2 && range.every(item => typeof item === 'string' || typeof item === 'number' || item instanceof Date);
          } else {
            return true;
          }
        }

      },
      firstDayOfWeek: {
        type: Number,
        default: 1
      }
    },
    emits: ['input', 'update:modelValue'],

    setup(props, {
      emit
    }) {
      const instance = vue.getCurrentInstance();
      vue.provide('elCalendar', instance);
      const state = vue.reactive({
        selectedDay: '',
        now: new Date()
      });
      const t = useLocale(); // computed

      const prevMonthDatePrefix = vue.computed(() => {
        const temp = new Date(date$1.value.getTime());
        temp.setDate(0);
        return date.format(temp, 'yyyy-MM');
      });
      const curMonthDatePrefix = vue.computed(() => {
        return date.format(date$1.value, 'yyyy-MM');
      });
      const nextMonthDatePrefix = vue.computed(() => {
        const temp = new Date(date$1.value.getFullYear(), date$1.value.getMonth() + 1, 1);
        return date.format(temp, 'yyyy-MM');
      });
      const formatedDate = vue.computed(() => {
        return date.format(date$1.value, 'yyyy-MM-dd');
      });
      const i18nDate = vue.computed(() => {
        const year = date$1.value.getFullYear();
        const month = date$1.value.getMonth() + 1;
        const pickedMonth = 'el.datepicker.month' + month;
        return `${year} ${t('el.datepicker.year')} ${t(pickedMonth)}`;
      });
      const formatedToday = vue.computed(() => {
        return date.format(state.now, 'yyyy-MM-dd');
      });
      const realSelectedDay = vue.computed({
        get() {
          if (!props.modelValue) return state.selectedDay;
          return formatedDate.value;
        },

        set(val) {
          state.selectedDay = val;
          const date = new Date(val);
          emit('input', date);
          emit('update:modelValue', date);
        }

      });
      const date$1 = vue.computed(() => {
        if (!props.modelValue) {
          if (realSelectedDay.value) {
            const d = state.selectedDay.split('-');
            return new Date(d[0], d[1] - 1, d[2]);
          } else if (validatedRange.value.length) {
            return validatedRange.value[0][0];
          }

          return state.now;
        } else {
          return toDate(props.modelValue);
        }
      });
      const validatedRange = vue.computed(() => {
        let range = props.range;
        if (!range) return [];
        range = props.range && range.reduce((prev, val, index) => {
          const date = toDate(val);

          if (rangeValidator(date, index === 0)) {
            prev = prev.concat(date);
          }

          return prev;
        }, []);

        if (range.length === 2) {
          const [start, end] = range;

          if (start > end) {
            console.warn('[ElementCalendar]end time should be greater than start time');
            return [];
          } // start time and end time in one month


          if (validateRangeInOneMonth(start, end)) {
            return [[start, end]];
          }

          const data = [];
          let startDay = new Date(start.getFullYear(), start.getMonth() + 1, 1);
          const lastDay = toDate(startDay.getTime() - oneDay);

          if (!validateRangeInOneMonth(startDay, end)) {
            console.warn('[ElementCalendar]start time and end time interval must not exceed two months');
            return [];
          } // 第一个月的时间范围


          data.push([start, lastDay]); // 下一月的时间范围，需要计算一下该月的第一个周起始日

          const firstDayOfWeek = realFirstDayOfWeek.value;
          const nextMontFirstDay = startDay.getDay();
          let interval = 0;

          if (nextMontFirstDay !== firstDayOfWeek) {
            if (firstDayOfWeek === 0) {
              interval = 7 - nextMontFirstDay;
            } else {
              interval = firstDayOfWeek - nextMontFirstDay;
              interval = interval > 0 ? interval : 7 + interval;
            }
          }

          startDay = toDate(startDay.getTime() + interval * oneDay);

          if (startDay.getDate() < end.getDate()) {
            data.push([startDay, end]);
          }

          return data;
        }

        return [];
      }); // if range is valid, we get a two-digit array

      const realFirstDayOfWeek = vue.computed(() => {
        if (props.firstDayOfWeek < 1 || props.firstDayOfWeek > 6) {
          return 0;
        }

        return Math.floor(props.firstDayOfWeek);
      }); // methods;

      const pickDay = day => {
        realSelectedDay.value = day;
      };

      const selectDate = type => {
        if (validTypes.indexOf(type) === -1) {
          throw new Error(`invalid type ${type}`);
        }

        let day = '';

        if (type === 'prev-month') {
          day = `${prevMonthDatePrefix.value}-01`;
        } else if (type === 'next-month') {
          day = `${nextMonthDatePrefix.value}-01`;
        } else {
          day = formatedToday.value;
        }

        if (day === formatedDate.value) return;
        pickDay(day);
      };

      const toDate = val => {
        if (!val) {
          throw new Error('invalid val');
        }

        return val instanceof Date ? val : new Date(val);
      };

      const rangeValidator = (date, isStart) => {
        const firstDayOfWeek = realFirstDayOfWeek.value;
        const expected = isStart ? firstDayOfWeek : firstDayOfWeek === 0 ? 6 : firstDayOfWeek - 1;
        const message = `${isStart ? 'start' : 'end'} of range should be ${weekDays[expected]}.`;

        if (date.getDay() !== expected) {
          console.warn('[ElementCalendar]', message, 'Invalid range will be ignored.');
          return false;
        }

        return true;
      };

      return { ...vue.toRefs(state),
        prevMonthDatePrefix,
        curMonthDatePrefix,
        nextMonthDatePrefix,
        formatedDate,
        i18nDate,
        formatedToday,
        realSelectedDay,
        date: date$1,
        validatedRange,
        realFirstDayOfWeek,
        pickDay,
        selectDate,
        toDate,
        t,
        rangeValidator
      };
    }

  };

  const _hoisted_1$4 = {
    class: "el-calendar"
  };
  const _hoisted_2$4 = {
    class: "el-calendar__header"
  };
  const _hoisted_3$3 = {
    class: "el-calendar__title"
  };
  const _hoisted_4$2 = {
    key: 0,
    class: "el-calendar__button-group"
  };
  const _hoisted_5$1 = {
    key: 0,
    class: "el-calendar__body"
  };
  const _hoisted_6$1 = {
    key: 1,
    class: "el-calendar__body"
  };
  function render$6(_ctx, _cache, $props, $setup, $data, $options) {
    const _component_el_button = vue.resolveComponent("el-button");

    const _component_el_button_group = vue.resolveComponent("el-button-group");

    const _component_date_table = vue.resolveComponent("date-table");

    return vue.openBlock(), vue.createBlock("div", _hoisted_1$4, [vue.createVNode("div", _hoisted_2$4, [vue.createVNode("div", _hoisted_3$3, vue.toDisplayString($setup.i18nDate), 1
    /* TEXT */
    ), $setup.validatedRange.length === 0 ? (vue.openBlock(), vue.createBlock("div", _hoisted_4$2, [vue.createVNode(_component_el_button_group, null, {
      default: vue.withCtx(() => [vue.createVNode(_component_el_button, {
        type: "plain",
        size: "mini",
        onClick: _cache[1] || (_cache[1] = $event => $setup.selectDate('prev-month'))
      }, {
        default: vue.withCtx(() => [vue.createTextVNode(vue.toDisplayString($setup.t('el.datepicker.prevMonth')), 1
        /* TEXT */
        )]),
        _: 1
        /* STABLE */

      }), vue.createVNode(_component_el_button, {
        type: "plain",
        size: "mini",
        onClick: _cache[2] || (_cache[2] = $event => $setup.selectDate('today'))
      }, {
        default: vue.withCtx(() => [vue.createTextVNode(vue.toDisplayString($setup.t('el.datepicker.today')), 1
        /* TEXT */
        )]),
        _: 1
        /* STABLE */

      }), vue.createVNode(_component_el_button, {
        type: "plain",
        size: "mini",
        onClick: _cache[3] || (_cache[3] = $event => $setup.selectDate('next-month'))
      }, {
        default: vue.withCtx(() => [vue.createTextVNode(vue.toDisplayString($setup.t('el.datepicker.nextMonth')), 1
        /* TEXT */
        )]),
        _: 1
        /* STABLE */

      })]),
      _: 1
      /* STABLE */

    })])) : vue.createCommentVNode("v-if", true)]), $setup.validatedRange.length === 0 ? (vue.openBlock(), vue.createBlock("div", _hoisted_5$1, [vue.createVNode(_component_date_table, {
      date: $setup.date,
      "selected-day": $setup.realSelectedDay,
      "first-day-of-week": $setup.realFirstDayOfWeek,
      onPick: $setup.pickDay
    }, null, 8
    /* PROPS */
    , ["date", "selected-day", "first-day-of-week", "onPick"])])) : (vue.openBlock(), vue.createBlock("div", _hoisted_6$1, [(vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList($setup.validatedRange, (range, index) => {
      return vue.openBlock(), vue.createBlock(_component_date_table, {
        key: index,
        date: range[0],
        "selected-day": $setup.realSelectedDay,
        range: range,
        "hide-header": index !== 0,
        "first-day-of-week": $setup.realFirstDayOfWeek,
        onPick: $setup.pickDay
      }, null, 8
      /* PROPS */
      , ["date", "selected-day", "range", "hide-header", "first-day-of-week", "onPick"]);
    }), 128
    /* KEYED_FRAGMENT */
    ))]))]);
  }

  script$6.render = render$6;
  script$6.__file = "packages/calendar/Calendar.vue";

  /* istanbul ignore next */

  script$6.install = function (app) {
    app.component(script$6.name, script$6);
  };

  const Mode = {
    CONTAIN: {
      name: 'contain',
      icon: 'el-icon-full-screen'
    },
    ORIGINAL: {
      name: 'original',
      icon: 'el-icon-c-scale-to-original'
    }
  };
  const mousewheelEventName = isFirefox() ? 'DOMMouseScroll' : 'mousewheel';
  var script$5 = {
    name: 'elImageViewer',
    props: {
      urlList: {
        type: Array,
        default: () => []
      },
      zIndex: {
        type: Number,
        default: 2000
      },
      onSwitch: {
        type: Function,
        default: () => {}
      },
      onClose: {
        type: Function,
        default: () => {}
      },
      initialIndex: {
        type: Number,
        default: 0
      }
    },

    setup(props) {
      const img = vue.ref(null);
      const imageWrapper = vue.ref(null); // data

      const state = vue.reactive({
        mode: Mode.CONTAIN,
        transform: {
          scale: 1,
          deg: 0,
          offsetX: 0,
          offsetY: 0,
          enableTransition: false
        }
      });
      const index = vue.ref(props.initialIndex);
      let loading = vue.ref(false);
      const infinite = vue.ref(true);
      const isShow = vue.ref(true); // computed

      const isSingle = vue.computed(() => props.urlList.length <= 1);
      const isFirst = vue.computed(() => props.index === 0);
      const isLast = vue.computed(() => props.index === props.urlList.length - 1);
      const currentImg = vue.computed(() => props.urlList[index.value]);
      const imgStyle = vue.computed(() => {
        const {
          scale,
          deg,
          offsetX,
          offsetY,
          enableTransition
        } = state.transform;
        const style = {
          transform: `scale(${scale}) rotate(${deg}deg)`,
          transition: enableTransition ? 'transform .3s' : '',
          'margin-left': `${offsetX}px`,
          'margin-top': `${offsetY}px`
        };

        if (state.mode.name === Mode.CONTAIN.name) {
          style.maxWidth = style.maxHeight = '100%';
        }

        return style;
      }); // lifeC

      vue.onMounted(() => {
        deviceSupportInstall(); // add tabindex then wrapper can be focusable via Javascript
        // focus wrapper so arrow key can't cause inner scroll behavior underneath

        imageWrapper.value.focus();
      }); // watch

      vue.watch(index, val => {
        reset();
        props.onSwitch(val);
      });
      vue.watch(currentImg, () => {
        vue.nextTick(() => {
          if (img.value.complete) {
            loading = true;
          }
        });
      }); // methods

      const handleActions = (action, options = {}) => {
        if (loading.value) return;
        const {
          zoomRate,
          rotateDeg,
          enableTransition
        } = {
          zoomRate: 0.2,
          rotateDeg: 90,
          enableTransition: true,
          ...options
        };

        switch (action) {
          case 'zoomOut':
            if (state.transform.scale > 0.2) {
              state.transform.scale = parseFloat((state.transform.scale - zoomRate).toFixed(3));
            }

            break;

          case 'zoomIn':
            state.transform.scale = parseFloat((state.transform.scale + zoomRate).toFixed(3));
            break;

          case 'clocelise':
            state.transform.deg += rotateDeg;
            break;

          case 'anticlocelise':
            state.transform.deg -= rotateDeg;
            break;
        }

        state.transform.enableTransition = enableTransition;
      };

      const reset = () => {
        state.transform = {
          scale: 1,
          deg: 0,
          offsetX: 0,
          offsetY: 0,
          enableTransition: false
        };
      };

      const toggleMode = () => {
        if (loading.value) return;
        const modeNames = Object.keys(Mode);
        const modeValues = Object.values(Mode);
        const index = modeValues.findIndex(index => index.name === state.mode.name);
        const nextIndex = (index + 1) % modeNames.length;
        state.mode = Mode[modeNames[nextIndex]];
        reset();
      };

      const prev = () => {
        if (isFirst.value && !infinite.value) return;
        const len = props.urlList.length;
        index.value = (index.value - 1 + len) % len;
      };

      const next = () => {
        if (isLast.value && !infinite.value) return;
        const len = props.urlList.length;
        index.value = (index.value + 1) % len;
      };

      let keyDownHandler = rafThrottle(e => {
        const keyCode = e.keyCode;

        switch (keyCode) {
          // ESC
          case 27:
            hide();
            break;
          // SPACE

          case 32:
            toggleMode();
            break;
          // LEFT_ARROW

          case 37:
            prev();
            break;
          // UP_ARROW

          case 38:
            handleActions('zoomIn');
            break;
          // RIGHT_ARROW

          case 39:
            next();
            break;
          // DOWN_ARROW

          case 40:
            handleActions('zoomOut');
            break;
        }
      });
      let mouseWheelHandler = rafThrottle(e => {
        const delta = e.wheelDelta ? e.wheelDelta : -e.detail;

        if (delta > 0) {
          handleActions('zoomIn', {
            zoomRate: 0.015,
            enableTransition: false
          });
        } else {
          handleActions('zoomOut', {
            zoomRate: 0.015,
            enableTransition: false
          });
        }
      });

      const deviceSupportInstall = () => {
        on(document, 'keydown', keyDownHandler);
        on(document, mousewheelEventName, mouseWheelHandler);
      };

      const deviceSupportUninstall = () => {
        off(document, 'keydown', keyDownHandler);
        off(document, mousewheelEventName, mouseWheelHandler);
        keyDownHandler = null;
        mouseWheelHandler = null;
      };

      const hide = () => {
        deviceSupportUninstall();
        props.onClose();
      };

      const handleImgLoad = () => {
        loading = false;
      };

      const handleImgError = e => {
        loading = false;
        e.target.alt = '加载失败';
      };

      const handleMouseDown = e => {
        if (loading || e.button !== 0) return;
        const {
          offsetX,
          offsetY
        } = state.transform;
        const startX = e.pageX;
        const startY = e.pageY;

        const _dragHandler = rafThrottle(ev => {
          state.transform.offsetX = offsetX + ev.pageX - startX;
          state.transform.offsetY = offsetY + ev.pageY - startY;
        });

        on(document, 'mousemove', _dragHandler);
        on(document, 'mouseup', () => {
          off(document, 'mousemove', _dragHandler);
        });
        e.preventDefault();
      };

      return {
        img,
        imageWrapper,
        loading,
        isShow,
        state,
        infinite,
        index,
        isSingle,
        isFirst,
        isLast,
        currentImg,
        imgStyle,
        reset,
        next,
        prev,
        toggleMode,
        handleActions,
        hide,
        keyDownHandler,
        mouseWheelHandler,
        deviceSupportInstall,
        deviceSupportUninstall,
        handleImgLoad,
        handleImgError,
        handleMouseDown
      };
    }

  };

  const _hoisted_1$3 = /*#__PURE__*/vue.createVNode("div", {
    class: "el-image-viewer__mask"
  }, null, -1
  /* HOISTED */
  );

  const _hoisted_2$3 = /*#__PURE__*/vue.createVNode("i", {
    class: "el-icon-circle-close"
  }, null, -1
  /* HOISTED */
  );

  const _hoisted_3$2 = /*#__PURE__*/vue.createVNode("i", {
    class: "el-icon-arrow-left"
  }, null, -1
  /* HOISTED */
  );

  const _hoisted_4$1 = /*#__PURE__*/vue.createVNode("i", {
    class: "el-icon-arrow-right"
  }, null, -1
  /* HOISTED */
  );

  const _hoisted_5 = {
    class: "el-image-viewer__btn el-image-viewer__actions"
  };
  const _hoisted_6 = {
    class: "el-image-viewer__actions__inner"
  };

  const _hoisted_7 = /*#__PURE__*/vue.createVNode("i", {
    class: "el-image-viewer__actions__divider"
  }, null, -1
  /* HOISTED */
  );

  const _hoisted_8 = /*#__PURE__*/vue.createVNode("i", {
    class: "el-image-viewer__actions__divider"
  }, null, -1
  /* HOISTED */
  );

  const _hoisted_9 = {
    class: "el-image-viewer__canvas"
  };
  function render$5(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock(vue.Transition, {
      name: "viewer-fade"
    }, {
      default: vue.withCtx(() => [vue.createVNode("div", {
        tabindex: "-1",
        ref: "imageWrapper",
        class: "el-image-viewer__wrapper",
        style: {
          'z-index': $props.zIndex
        }
      }, [_hoisted_1$3, vue.createCommentVNode(" CLOSE "), vue.createVNode("span", {
        class: "el-image-viewer__btn el-image-viewer__close",
        onClick: _cache[1] || (_cache[1] = (...args) => $setup.hide && $setup.hide(...args))
      }, [_hoisted_2$3]), vue.createCommentVNode(" ARROW "), !$setup.isSingle ? (vue.openBlock(), vue.createBlock(vue.Fragment, {
        key: 0
      }, [vue.createVNode("span", {
        class: ["el-image-viewer__btn el-image-viewer__prev", {
          'is-disabled': !$setup.infinite && $setup.isFirst
        }],
        onClick: _cache[2] || (_cache[2] = (...args) => $setup.prev && $setup.prev(...args))
      }, [_hoisted_3$2], 2
      /* CLASS */
      ), vue.createVNode("span", {
        class: ["el-image-viewer__btn el-image-viewer__next", {
          'is-disabled': !$setup.infinite && $setup.isLast
        }],
        onClick: _cache[3] || (_cache[3] = (...args) => $setup.next && $setup.next(...args))
      }, [_hoisted_4$1], 2
      /* CLASS */
      )], 64
      /* STABLE_FRAGMENT */
      )) : vue.createCommentVNode("v-if", true), vue.createCommentVNode(" ACTIONS "), vue.createVNode("div", _hoisted_5, [vue.createVNode("div", _hoisted_6, [vue.createVNode("i", {
        class: "el-icon-zoom-out",
        onClick: _cache[4] || (_cache[4] = $event => $setup.handleActions('zoomOut'))
      }), vue.createVNode("i", {
        class: "el-icon-zoom-in",
        onClick: _cache[5] || (_cache[5] = $event => $setup.handleActions('zoomIn'))
      }), _hoisted_7, vue.createVNode("i", {
        class: $setup.state.mode.icon,
        onClick: _cache[6] || (_cache[6] = (...args) => $setup.toggleMode && $setup.toggleMode(...args))
      }, null, 2
      /* CLASS */
      ), _hoisted_8, vue.createVNode("i", {
        class: "el-icon-refresh-left",
        onClick: _cache[7] || (_cache[7] = $event => $setup.handleActions('anticlocelise'))
      }), vue.createVNode("i", {
        class: "el-icon-refresh-right",
        onClick: _cache[8] || (_cache[8] = $event => $setup.handleActions('clocelise'))
      })])]), vue.createCommentVNode(" CANVAS "), vue.createVNode("div", _hoisted_9, [vue.createVNode("img", {
        ref: "img",
        class: "el-image-viewer__img",
        src: $setup.currentImg,
        style: $setup.imgStyle,
        onLoad: _cache[9] || (_cache[9] = (...args) => $setup.handleImgLoad && $setup.handleImgLoad(...args)),
        onError: _cache[10] || (_cache[10] = (...args) => $setup.handleImgError && $setup.handleImgError(...args)),
        onMousedown: _cache[11] || (_cache[11] = (...args) => $setup.handleMouseDown && $setup.handleMouseDown(...args))
      }, null, 44
      /* STYLE, PROPS, HYDRATE_EVENTS */
      , ["src"])])], 4
      /* STYLE */
      )]),
      _: 1
      /* STABLE */

    });
  }

  script$5.render = render$5;
  script$5.__file = "packages/image/ImageViewer.vue";

  const isSupportObjectFit = () => document.documentElement.style.objectFit !== undefined;

  const ObjectFit = {
    NONE: 'none',
    CONTAIN: 'contain',
    COVER: 'cover',
    FILL: 'fill',
    SCALE_DOWN: 'scale-down'
  };
  let prevOverflow = '';
  var script$4 = {
    name: 'ElImage',
    inheritAttrs: false,
    components: {
      ImageViewer: script$5
    },
    props: {
      src: String,
      fit: String,
      lazy: Boolean,
      scrollContainer: {},
      previewSrcList: {
        type: Array,
        default: () => []
      },
      zIndex: {
        type: Number,
        default: 2000
      }
    },
    emits: ['error'],

    setup(props, ctx) {
      const instance = vue.getCurrentInstance();
      const loading = vue.ref(true);
      const error = vue.ref(false);
      const show = vue.ref(!props.lazy);
      const showViewer = vue.ref(false);
      const imageWidth = vue.ref(0);
      const imageHeight = vue.ref(0); // computed

      const imageStyle = vue.computed(() => {
        const {
          fit
        } = props;

        if ( //! this.$isServer &&
        fit) {
          return isSupportObjectFit() ? {
            'object-fit': fit
          } : getImageStyle(fit);
        }

        return {};
      });
      const alignCenter = vue.computed(() => {
        return (// !this.$isServer &&
          !isSupportObjectFit() && props.fit !== ObjectFit.FILL
        );
      });
      const preview = vue.computed(() => {
        const {
          previewSrcList
        } = props;
        return Array.isArray(previewSrcList) && previewSrcList.length > 0;
      });
      const imageIndex = vue.computed(() => {
        let previewIndex = 0;
        const srcIndex = props.previewSrcList.indexOf(props.src);

        if (srcIndex >= 0) {
          previewIndex = srcIndex;
        }

        return previewIndex;
      }); // watch

      vue.watch(() => props.src, () => {
        show.value && loadImage();
      });
      vue.watch(show, val => {
        val && loadImage();
      }); // lifecycle

      vue.onMounted(() => {
        if (props.lazy) {
          addLazyLoadListener();
        } else {
          loadImage();
        }
      });
      vue.onBeforeUnmount(() => {
        props.lazy && removeLazyLoadListener();
      }); // methods

      const loadImage = () => {
        // if (this.$isServer) return
        // reset status
        loading.value = true;
        error.value = false;
        const img = new Image();

        img.onload = e => handleLoad(e, img);

        img.onerror = handleError.bind(this); // bind html attrs
        // so it can behave consistently

        Object.keys(instance.proxy.$attrs).forEach(key => {
          const value = instance.proxy.$attrs[key];
          img.setAttribute(key, value);
        });
        img.src = props.src;
      };

      const handleLoad = (e, img) => {
        imageWidth.value = img.width;
        imageHeight.value = img.height;
        loading.value = false;
        error.value = false;
      };

      const handleError = e => {
        loading.value = false;
        error.value = true;
        ctx.emit('error', e);
      };

      const handleLazyLoad = () => {
        if (isInContainer(instance.proxy.$el, instance.proxy._scrollContainer)) {
          show.value = true;
          removeLazyLoadListener();
        }
      };

      const addLazyLoadListener = () => {
        // if (this.$isServer) return
        const {
          scrollContainer
        } = props;
        let _scrollContainer = null;

        if (isHtmlElement(scrollContainer)) {
          _scrollContainer = scrollContainer;
        } else if (isString(scrollContainer)) {
          _scrollContainer = document.querySelector(scrollContainer);
        } else {
          _scrollContainer = getScrollContainer(instance.proxy.$el);
        }

        if (_scrollContainer) {
          instance.proxy._scrollContainer = _scrollContainer;
          instance.proxy._lazyLoadHandler = throttle$1(200, handleLazyLoad);
          on(_scrollContainer, 'scroll', instance.proxy._lazyLoadHandler);
          handleLazyLoad();
        }
      };

      const removeLazyLoadListener = () => {
        const {
          _scrollContainer,
          _lazyLoadHandler
        } = instance.proxy;
        if ( // this.$isServer ||
        !_scrollContainer || !_lazyLoadHandler) return;
        off(_scrollContainer, 'scroll', _lazyLoadHandler);
        instance.proxy._scrollContainer = null;
        instance.proxy._lazyLoadHandler = null;
      };
      /**
       * simulate object-fit behavior to compatible with IE11 and other browsers which not support object-fit
       */


      const getImageStyle = fit => {
        const {
          clientWidth: containerWidth,
          clientHeight: containerHeight
        } = instance.proxy.$el;
        if (!imageWidth.value || !imageHeight.value || !containerWidth || !containerHeight) return {};
        const vertical = imageWidth.value / imageHeight.value < 1;

        if (fit === ObjectFit.SCALE_DOWN) {
          const isSmaller = imageWidth.value < containerWidth && imageHeight.value < containerHeight;
          fit = isSmaller ? ObjectFit.NONE : ObjectFit.CONTAIN;
        }

        switch (fit) {
          case ObjectFit.NONE:
            return {
              width: 'auto',
              height: 'auto'
            };

          case ObjectFit.CONTAIN:
            return vertical ? {
              width: 'auto'
            } : {
              height: 'auto'
            };

          case ObjectFit.COVER:
            return vertical ? {
              height: 'auto'
            } : {
              width: 'auto'
            };

          default:
            return {};
        }
      };

      const clickHandler = () => {
        // don't show viewer when preview is false
        if (!preview.value) {
          return;
        } // prevent body scroll


        prevOverflow = document.body.style.overflow;
        document.body.style.overflow = 'hidden';
        showViewer.value = true;
      };

      const closeViewer = () => {
        document.body.style.overflow = prevOverflow;
        showViewer.value = false;
      };

      return {
        loading,
        error,
        show,
        showViewer,
        imageWidth,
        imageHeight,
        imageStyle,
        alignCenter,
        preview,
        imageIndex,
        loadImage,
        handleLoad,
        handleError,
        handleLazyLoad,
        getImageStyle,
        addLazyLoadListener,
        removeLazyLoadListener,
        clickHandler,
        closeViewer,
        t
      };
    }

  };

  const _hoisted_1$2 = {
    class: "el-image"
  };

  const _hoisted_2$2 = /*#__PURE__*/vue.createVNode("div", {
    class: "el-image__placeholder"
  }, null, -1
  /* HOISTED */
  );

  const _hoisted_3$1 = {
    class: "el-image__error"
  };
  function render$4(_ctx, _cache, $props, $setup, $data, $options) {
    const _component_image_viewer = vue.resolveComponent("image-viewer");

    return vue.openBlock(), vue.createBlock("div", _hoisted_1$2, [$setup.loading ? vue.renderSlot(_ctx.$slots, "placeholder", {
      key: 0
    }, () => [_hoisted_2$2]) : $setup.error ? vue.renderSlot(_ctx.$slots, "error", {
      key: 1
    }, () => [vue.createVNode("div", _hoisted_3$1, vue.toDisplayString($setup.t('el.image.error')), 1
    /* TEXT */
    )]) : (vue.openBlock(), vue.createBlock("img", vue.mergeProps({
      key: 2,
      class: "el-image__inner"
    }, _ctx.$attrs, {
      onClick: _cache[1] || (_cache[1] = (...args) => $setup.clickHandler && $setup.clickHandler(...args)),
      src: $props.src,
      style: $setup.imageStyle,
      class: {
        'el-image__inner--center': $setup.alignCenter,
        'el-image__preview': $setup.preview
      }
    }), null, 16
    /* FULL_PROPS */
    , ["src"])), $setup.preview ? (vue.openBlock(), vue.createBlock(vue.Fragment, {
      key: 3
    }, [$setup.showViewer ? (vue.openBlock(), vue.createBlock(_component_image_viewer, {
      key: 0,
      "z-index": $props.zIndex,
      "initial-index": $setup.imageIndex,
      "on-close": $setup.closeViewer,
      "url-list": $props.previewSrcList
    }, null, 8
    /* PROPS */
    , ["z-index", "initial-index", "on-close", "url-list"])) : vue.createCommentVNode("v-if", true)], 64
    /* STABLE_FRAGMENT */
    )) : vue.createCommentVNode("v-if", true)]);
  }

  script$4.render = render$4;
  script$4.__file = "packages/image/Image.vue";

  /* istanbul ignore next */

  script$4.install = function (app) {
    app.component(script$4.name, script$4);
  };

  const cubic = value => Math.pow(value, 3);

  const easeInOutCubic = value => value < 0.5 ? cubic(value * 2) / 2 : 1 - cubic((1 - value) * 2) / 2;

  var script$3 = {
    name: 'ElBacktop',
    components: {
      ElIcon: script$1v
    },
    props: {
      visibilityHeight: {
        type: Number,
        default: 200
      },
      target: {
        type: String,
        default: null
      },
      right: {
        type: Number,
        default: 40
      },
      bottom: {
        type: Number,
        default: 40
      }
    },

    setup(props, {
      emit
    }) {
      const el = vue.ref(null);
      const container = vue.ref(null);
      const visible = vue.ref(null);
      let throttledScrollHandler;
      const {
        visibilityHeight,
        target,
        right,
        bottom
      } = vue.toRefs(props);
      const styleBottom = vue.computed(() => `${bottom.value}px`);
      const styleRight = vue.computed(() => `${right.value}px`);

      const init = () => {
        container.value = document;
        el.value = document.documentElement;

        if (target.value) {
          el.value = document.querySelector(target.value);

          if (!el.value) {
            throw new Error(`target is not existed: ${target.value}`);
          }

          container.value = el.value;
        }
      };

      const onScroll = () => {
        const scrollTop = el.value.scrollTop;
        visible.value = scrollTop >= visibilityHeight.value;
      };

      const handleClick = e => {
        scrollToTop();
        emit('click', e);
      };

      const scrollToTop = () => {
        const element = el.value;
        const beginTime = Date.now();
        const beginValue = element.scrollTop;

        const rAF = window.requestAnimationFrame || (func => setTimeout(func, 16));

        const frameFunc = () => {
          const progress = (Date.now() - beginTime) / 500;

          if (progress < 1) {
            element.scrollTop = beginValue * (1 - easeInOutCubic(progress));
            rAF(frameFunc);
          } else {
            element.scrollTop = 0;
          }
        };

        rAF(frameFunc);
      };

      vue.onMounted(() => {
        init();
        throttledScrollHandler = throttle$1(300, onScroll);
        container.value.addEventListener('scroll', throttledScrollHandler);
      });
      vue.onUnmounted(() => {
        container.value.removeEventListener('scroll', throttledScrollHandler);
      });
      return {
        visible,
        styleBottom,
        styleRight,
        handleClick
      };
    }

  };

  function render$3(_ctx, _cache, $props, $setup, $data, $options) {
    const _component_el_icon = vue.resolveComponent("el-icon");

    return vue.openBlock(), vue.createBlock(vue.Transition, {
      name: "el-fade-in"
    }, {
      default: vue.withCtx(() => [$setup.visible ? (vue.openBlock(), vue.createBlock("div", {
        key: 0,
        onClick: _cache[1] || (_cache[1] = vue.withModifiers((...args) => $setup.handleClick && $setup.handleClick(...args), ["stop"])),
        style: {
          right: $setup.styleRight,
          bottom: $setup.styleBottom
        },
        class: "el-backtop"
      }, [vue.renderSlot(_ctx.$slots, "default", {}, () => [vue.createVNode(_component_el_icon, {
        name: "caret-top"
      })])], 4
      /* STYLE */
      )) : vue.createCommentVNode("v-if", true)]),
      _: 1
      /* STABLE */

    });
  }

  script$3.render = render$3;
  script$3.__file = "packages/backtop/Backtop.vue";

  /* istanbul ignore next */

  script$3.install = function (app) {
    app.component(script$3.name, script$3);
  };

  const getStyleComputedProperty = (element, property) => {
    if (element === window) {
      element = document.documentElement;
    }

    if (element.nodeType !== 1) {
      return [];
    } // NOTE: 1 DOM access here


    const css = window.getComputedStyle(element, null);
    return property ? css[property] : css;
  };

  const entries = obj => {
    return Object.keys(obj || {}).map(key => [key, obj[key]]);
  };

  const getPositionSize = (el, prop) => {
    return el === window || el === document ? document.documentElement[prop] : el[prop];
  };

  const getOffsetHeight = el => {
    return getPositionSize(el, 'offsetHeight');
  };

  const getClientHeight = el => {
    return getPositionSize(el, 'clientHeight');
  };

  const scope = 'ElInfiniteScroll';
  const attributes = {
    delay: {
      type: Number,
      default: 200
    },
    distance: {
      type: Number,
      default: 0
    },
    disabled: {
      type: Boolean,
      default: false
    },
    immediate: {
      type: Boolean,
      default: true
    }
  };

  const getScrollOptions = el => {
    if (!isHtmlElement(el)) return {};
    return entries(attributes).reduce((map, [key, option]) => {
      const {
        type,
        default: defaultValue
      } = option;
      const attributeName = `infinite-scroll-${key}`;
      let value = el.hasAttribute(attributeName) ? el.getAttribute(attributeName) : defaultValue;

      switch (type) {
        case Number:
          value = Number(value);
          value = Number.isNaN(value) ? defaultValue : value;
          break;

        case Boolean:
          value = isDefined(value) ? value === 'false' ? false : Boolean(value) : defaultValue;
          break;

        default:
          value = type(value);
      }

      map[key] = value;
      return map;
    }, {});
  };

  const getElementTop = el => el.getBoundingClientRect().top;

  const handleScroll = function (cb) {
    const {
      el,
      container,
      observer
    } = this[scope];
    const {
      distance,
      disabled
    } = getScrollOptions(el);
    if (disabled) return;
    const containerInfo = container.getBoundingClientRect();
    if (!containerInfo.width && !containerInfo.height) return;
    let shouldTrigger = false;

    if (container === el) {
      // be aware of difference between clientHeight & offsetHeight & window.getComputedStyle().height
      const scrollBottom = container.scrollTop + getClientHeight(container);
      shouldTrigger = container.scrollHeight - scrollBottom <= distance;
    } else {
      const heightBelowTop = getOffsetHeight(el) + getElementTop(el) - getElementTop(container);
      const offsetHeight = getOffsetHeight(container);
      const borderBottom = Number.parseFloat(getStyleComputedProperty(container, 'borderBottomWidth'));
      shouldTrigger = heightBelowTop - offsetHeight + borderBottom <= distance;
    }

    if (shouldTrigger && isFunction$1(cb)) {
      cb.call();
    } else if (observer) {
      observer.disconnect();
      this[scope].observer = null;
    }
  };

  var ElInfiniteScroll = {
    name: 'InfiniteScroll',

    mounted(el, binding) {
      const cb = binding.value; // only include vertical scroll

      const container = getScrollContainer(el, true);
      const {
        delay,
        immediate
      } = getScrollOptions(el);
      const onScroll = throttle$1(delay, handleScroll.bind(el, cb));
      el[scope] = {
        el,
        container,
        onScroll
      };

      if (container) {
        container.addEventListener('scroll', onScroll);

        if (immediate) {
          const observer = el[scope].observer = new MutationObserver(onScroll);
          observer.observe(container, {
            childList: true,
            subtree: true
          });
          onScroll();
        }
      }
    },

    unmounted(el) {
      const {
        container,
        onScroll
      } = el[scope];

      if (container) {
        container.removeEventListener('scroll', onScroll);
      }
    }

  };

  /* istanbul ignore next */

  ElInfiniteScroll.install = function (app) {
    app.directive(ElInfiniteScroll.name, ElInfiniteScroll);
  };

  var script$2 = {
    name: 'ElDrawer',
    props: { ...popupProps,
      appendToBody: {
        type: Boolean,
        default: false
      },
      beforeClose: {
        type: Function
      },
      customClass: {
        type: String,
        default: ''
      },
      closeOnPressEscape: {
        type: Boolean,
        default: true
      },
      destroyOnClose: {
        type: Boolean,
        default: false
      },
      modal: {
        type: Boolean,
        default: true
      },
      direction: {
        type: String,
        default: 'rtl',

        validator(val) {
          return ['ltr', 'rtl', 'ttb', 'btt'].indexOf(val) !== -1;
        }

      },
      modalAppendToBody: {
        type: Boolean,
        default: true
      },
      showClose: {
        type: Boolean,
        default: true
      },
      size: {
        type: String,
        default: '30%'
      },
      title: {
        type: String,
        default: ''
      },
      visible: {
        type: Boolean
      },
      wrapperClosable: {
        type: Boolean,
        default: true
      },
      withHeader: {
        type: Boolean,
        default: true
      }
    },
    emits: ['update:visible', 'close', 'opened', 'open', 'closed'],

    setup(props, {
      emit
    }) {
      const {
        rendered,
        open
      } = usePopup(props);
      const {
        appendToBody,
        beforeClose,
        destroyOnClose,
        direction,
        visible,
        wrapperClosable
      } = vue.toRefs(props);
      const closed = vue.ref(false);
      const prevActiveElement = vue.ref(null);
      const drawer = vue.ref(null);
      const self = vue.getCurrentInstance().proxy;
      const isHorizontal = vue.computed(() => {
        return direction.value === 'rtl' || direction.value === 'ltr';
      });
      vue.watch(visible, val => {
        const el = self.$el;

        if (val) {
          closed.value = false;
          emit('open');

          if (appendToBody.value) {
            document.body.appendChild(el);
          }

          prevActiveElement.value = document.activeElement;
          vue.nextTick(() => {
            Utils.focusFirstDescendant(drawer.value);
          });
        } else {
          if (!closed.value) emit('close');
          vue.nextTick(() => {
            if (prevActiveElement.value) {
              prevActiveElement.value.focus();
            }
          });
        }
      });

      const afterEnter = () => {
        emit('opened');
      };

      const afterLeave = () => {
        emit('closed');
      };

      const handleWrapperClick = () => {
        if (wrapperClosable.value) {
          closeDrawer();
        }
      };

      const closeDrawer = () => {
        if (beforeClose && typeof beforeClose.value === 'function') {
          beforeClose.value(hide);
        } else {
          hide();
        }
      };

      const hide = cancel => {
        if (cancel !== false) {
          emit('update:visible', false);
          emit('close');

          if (destroyOnClose.value === true) {
            rendered.value = false;
          }

          closed.value = true;
        }
      }; // todo: ESC 退出模态框,暂时无调用，lint过不去先在return调用


      const handleClose = () => {
        // This method here will be called by PopupManger, when the `closeOnPressEscape` was set to true
        // pressing `ESC` will call this method, and also close the drawer.
        // This method also calls `beforeClose` if there was one.
        closeDrawer();
      };

      vue.onMounted(() => {
        if (visible.value) {
          rendered.value = true;
          open();
        }
      });
      vue.onUnmounted(() => {
        // if appendToBody is true, remove DOM node after destroy
        if (appendToBody.value && self.$el && self.$el.parentNode) {
          self.$el.parentNode.removeChild(self.$el);
        }
      });
      return {
        isHorizontal,
        drawer,
        rendered,
        afterEnter,
        afterLeave,
        handleWrapperClick,
        closeDrawer,
        handleClose
      };
    }

  };

  const _hoisted_1$1 = {
    class: "el-drawer__wrapper",
    tabindex: "-1"
  };
  const _hoisted_2$1 = {
    key: 0,
    class: "el-drawer__header",
    id: "el-drawer__title"
  };

  const _hoisted_3 = /*#__PURE__*/vue.createVNode("i", {
    class: "el-dialog__close el-icon el-icon-close"
  }, null, -1
  /* HOISTED */
  );

  const _hoisted_4 = {
    key: 1,
    class: "el-drawer__body"
  };
  function render$2(_ctx, _cache, $props, $setup, $data, $options) {
    return vue.openBlock(), vue.createBlock(vue.Transition, {
      name: "el-drawer-fade",
      onAfterEnter: $setup.afterEnter,
      onAfterLeave: $setup.afterLeave
    }, {
      default: vue.withCtx(() => [vue.withDirectives(vue.createVNode("div", _hoisted_1$1, [vue.createVNode("div", {
        class: ["el-drawer__container", $props.visible && 'el-drawer__open'],
        onClick: _cache[2] || (_cache[2] = vue.withModifiers((...args) => $setup.handleWrapperClick && $setup.handleWrapperClick(...args), ["self"])),
        role: "document",
        tabindex: "-1"
      }, [vue.createVNode("div", {
        "aria-modal": "true",
        "aria-labelledby": "el-drawer__title",
        "aria-label": $props.title,
        class: ["el-drawer", [$props.direction, $props.customClass]],
        style: $setup.isHorizontal ? `width: ${$props.size}` : `height: ${$props.size}`,
        ref: "drawer",
        role: "dialog",
        tabindex: "-1"
      }, [$props.withHeader ? (vue.openBlock(), vue.createBlock("header", _hoisted_2$1, [vue.renderSlot(_ctx.$slots, "title", {}, () => [vue.createVNode("span", {
        role: "heading",
        tabindex: "0",
        title: $props.title
      }, vue.toDisplayString($props.title), 9
      /* TEXT, PROPS */
      , ["title"])]), $props.showClose ? (vue.openBlock(), vue.createBlock("button", {
        key: 0,
        "aria-label": `close ${$props.title || 'drawer'}`,
        class: "el-drawer__close-btn",
        type: "button",
        onClick: _cache[1] || (_cache[1] = (...args) => $setup.closeDrawer && $setup.closeDrawer(...args))
      }, [_hoisted_3], 8
      /* PROPS */
      , ["aria-label"])) : vue.createCommentVNode("v-if", true)])) : vue.createCommentVNode("v-if", true), $setup.rendered ? (vue.openBlock(), vue.createBlock("section", _hoisted_4, [vue.renderSlot(_ctx.$slots, "default")])) : vue.createCommentVNode("v-if", true)], 14
      /* CLASS, STYLE, PROPS */
      , ["aria-label"])], 2
      /* CLASS */
      )], 512
      /* NEED_PATCH */
      ), [[vue.vShow, $props.visible]])]),
      _: 1
      /* STABLE */

    }, 8
    /* PROPS */
    , ["onAfterEnter", "onAfterLeave"]);
  }

  script$2.render = render$2;
  script$2.__file = "packages/drawer/Drawer.vue";

  /* istanbul ignore next */

  script$2.install = function (app) {
    app.component(script$2.name, script$2);
  };

  function broadcast(componentName, eventName, params) {
    this.$children.forEach(child => {
      var name = child.$options.componentName;

      if (name === componentName) {
        child.$emit.apply(child, [eventName].concat(params));
      } else {
        broadcast.apply(child, [componentName, eventName].concat([params]));
      }
    });
  }

  var Emitter = {
    methods: {
      dispatch(componentName, eventName, params) {
        var parent = this.$parent || this.$root;
        var name = parent.$options.componentName;

        while (parent && (!name || name !== componentName)) {
          parent = parent.$parent;

          if (parent) {
            name = parent.$options.componentName;
          }
        }

        if (parent) {
          parent.$emit.apply(parent, [eventName].concat(params));
        }
      },

      broadcast(componentName, eventName, params) {
        broadcast.call(this, componentName, eventName, params);
      }

    }
  };

  var script$1 = {
    components: {
      ElScrollbar
    },
    mixins: [Popper, Emitter],
    componentName: 'ElAutocompleteSuggestions',

    data() {
      return {
        parent: this.$parent,
        dropdownWidth: ''
      };
    },

    props: {
      options: {
        default() {
          return {
            gpuAcceleration: false
          };
        }

      },
      id: String
    },
    methods: {
      select(item) {
        this.dispatch('ElAutocomplete', 'item-click', item);
      }

    },

    updated() {
      this.$nextTick(() => {
        this.popperJS && this.updatePopper();
      });
    },

    mounted() {
      this.$parent.popperElm = this.popperElm = this.$el;
      this.referenceElm = this.$parent.$refs.input.$refs.input || this.$parent.$refs.input.$refs.textarea;
      this.referenceList = this.$el.querySelector('.el-autocomplete-suggestion__list');
      this.referenceList.setAttribute('role', 'listbox');
      this.referenceList.setAttribute('id', this.id);
    },

    created() {
      // TODO $on 已经废弃了
      // eslint-disable-next-line vue/no-deprecated-events-api
      this.$on('visible', (val, inputWidth) => {
        this.dropdownWidth = inputWidth + 'px';
        this.showPopper = val;
      });
    }

  };

  const _hoisted_1 = {
    key: 0
  };

  const _hoisted_2 = /*#__PURE__*/vue.createVNode("i", {
    class: "el-icon-loading"
  }, null, -1
  /* HOISTED */
  );

  function render$1(_ctx, _cache, $props, $setup, $data, $options) {
    const _component_el_scrollbar = vue.resolveComponent("el-scrollbar");

    return vue.openBlock(), vue.createBlock(vue.Transition, {
      name: "el-zoom-in-top",
      onAfterLeave: _ctx.doDestroy
    }, {
      default: vue.withCtx(() => [vue.withDirectives(vue.createVNode("div", {
        class: ["el-autocomplete-suggestion el-popper", {
          'is-loading': !$data.parent.hideLoading && $data.parent.loading
        }],
        style: {
          width: $data.dropdownWidth
        },
        role: "region"
      }, [vue.createVNode(_component_el_scrollbar, {
        tag: "ul",
        "wrap-class": "el-autocomplete-suggestion__wrap",
        "view-class": "el-autocomplete-suggestion__list"
      }, {
        default: vue.withCtx(() => [!$data.parent.hideLoading && $data.parent.loading ? (vue.openBlock(), vue.createBlock("li", _hoisted_1, [_hoisted_2])) : vue.renderSlot(_ctx.$slots, "default", {
          key: 1
        })]),
        _: 1
        /* STABLE */

      })], 6
      /* CLASS, STYLE */
      ), [[vue.vShow, _ctx.showPopper]])]),
      _: 1
      /* STABLE */

    }, 8
    /* PROPS */
    , ["onAfterLeave"]);
  }

  script$1.render = render$1;
  script$1.__file = "packages/autocomplete/src/autocomplete-suggestions.vue";

  var script = {
    name: 'ElAutocomplete',
    mixins: [Emitter, Focus('input'), Migrating],
    inheritAttrs: false,
    componentName: 'ElAutocomplete',
    components: {
      ElInput: script$1l,
      ElAutocompleteSuggestions: script$1
    },
    directives: {
      Clickoutside
    },
    props: {
      valueKey: {
        type: String,
        default: 'value'
      },
      popperClass: String,
      popperOptions: Object,
      placeholder: String,
      clearable: {
        type: Boolean,
        default: false
      },
      disabled: Boolean,
      name: String,
      size: String,
      value: String,
      maxlength: Number,
      minlength: Number,
      autofocus: Boolean,
      fetchSuggestions: Function,
      triggerOnFocus: {
        type: Boolean,
        default: true
      },
      customItem: String,
      selectWhenUnmatched: {
        type: Boolean,
        default: false
      },
      prefixIcon: String,
      suffixIcon: String,
      label: String,
      debounce: {
        type: Number,
        default: 300
      },
      placement: {
        type: String,
        default: 'bottom-start'
      },
      hideLoading: Boolean,
      popperAppendToBody: {
        type: Boolean,
        default: true
      },
      highlightFirstItem: {
        type: Boolean,
        default: false
      }
    },

    data() {
      return {
        activated: false,
        suggestions: [],
        loading: false,
        highlightedIndex: -1,
        suggestionDisabled: false
      };
    },

    computed: {
      suggestionVisible() {
        const suggestions = this.suggestions;
        const isValidData = Array.isArray(suggestions) && suggestions.length > 0;
        return (isValidData || this.loading) && this.activated;
      },

      id() {
        return `el-autocomplete-${generateId()}`;
      }

    },
    watch: {
      suggestionVisible(val) {
        const $input = this.getInput();

        if ($input) {
          this.broadcast('visible', [val, $input.offsetWidth]);
        }
      }

    },
    methods: {
      getMigratingConfig() {
        return {
          props: {
            'custom-item': 'custom-item is removed, use scoped slot instead.',
            props: 'props is removed, use value-key instead.'
          }
        };
      },

      getData(queryString) {
        if (this.suggestionDisabled) {
          return;
        }

        this.loading = true;
        this.fetchSuggestions(queryString, suggestions => {
          this.loading = false;

          if (this.suggestionDisabled) {
            return;
          }

          if (Array.isArray(suggestions)) {
            this.suggestions = suggestions;
            this.highlightedIndex = this.highlightFirstItem ? 0 : -1;
          } else {
            console.error('[Element Error][Autocomplete]autocomplete suggestions must be an array');
          }
        });
      },

      handleInput(value) {
        this.$emit('input', value);
        this.suggestionDisabled = false;

        if (!this.triggerOnFocus && !value) {
          this.suggestionDisabled = true;
          this.suggestions = [];
          return;
        }

        this.debouncedGetData(value);
      },

      handleChange(value) {
        this.$emit('change', value);
      },

      handleFocus(event) {
        this.activated = true;
        this.$emit('focus', event);

        if (this.triggerOnFocus) {
          this.debouncedGetData(this.value);
        }
      },

      handleBlur(event) {
        this.$emit('blur', event);
      },

      handleClear() {
        this.activated = false;
        this.$emit('clear');
      },

      close() {
        this.activated = false;
      },

      handleKeyEnter(e) {
        if (this.suggestionVisible && this.highlightedIndex >= 0 && this.highlightedIndex < this.suggestions.length) {
          e.preventDefault();
          this.select(this.suggestions[this.highlightedIndex]);
        } else if (this.selectWhenUnmatched) {
          this.$emit('select', {
            value: this.value
          });
          this.$nextTick(() => {
            this.suggestions = [];
            this.highlightedIndex = -1;
          });
        }
      },

      select(item) {
        this.$emit('input', item[this.valueKey]);
        this.$emit('select', item);
        this.$nextTick(() => {
          this.suggestions = [];
          this.highlightedIndex = -1;
        });
      },

      highlight(index) {
        if (!this.suggestionVisible || this.loading) {
          return;
        }

        if (index < 0) {
          this.highlightedIndex = -1;
          return;
        }

        if (index >= this.suggestions.length) {
          index = this.suggestions.length - 1;
        }

        const suggestion = this.$refs.suggestions.$el.querySelector('.el-autocomplete-suggestion__wrap');
        const suggestionList = suggestion.querySelectorAll('.el-autocomplete-suggestion__list li');
        const highlightItem = suggestionList[index];
        const scrollTop = suggestion.scrollTop;
        const offsetTop = highlightItem.offsetTop;

        if (offsetTop + highlightItem.scrollHeight > scrollTop + suggestion.clientHeight) {
          suggestion.scrollTop += highlightItem.scrollHeight;
        }

        if (offsetTop < scrollTop) {
          suggestion.scrollTop -= highlightItem.scrollHeight;
        }

        this.highlightedIndex = index;
        const $input = this.getInput();
        $input.setAttribute('aria-activedescendant', `${this.id}-item-${this.highlightedIndex}`);
      },

      getInput() {
        return this.$refs.input.getInput();
      }

    },

    mounted() {
      this.debouncedGetData = debounce$1(this.debounce, this.getData); // TODO $on 已经废弃
      // eslint-disable-next-line vue/no-deprecated-events-api

      this.$on('item-click', item => {
        this.select(item);
      });
      const $input = this.getInput();
      $input.setAttribute('role', 'textbox');
      $input.setAttribute('aria-autocomplete', 'list');
      $input.setAttribute('aria-controls', 'id');
      $input.setAttribute('aria-activedescendant', `${this.id}-item-${this.highlightedIndex}`);
    },

    beforeUnmount() {
      this.$refs.suggestions.$destroy();
    }

  };

  function render(_ctx, _cache, $props, $setup, $data, $options) {
    const _component_el_input = vue.resolveComponent("el-input");

    const _component_el_autocomplete_suggestions = vue.resolveComponent("el-autocomplete-suggestions");

    const _directive_clickoutside = vue.resolveDirective("clickoutside");

    return vue.withDirectives((vue.openBlock(), vue.createBlock("div", {
      class: "el-autocomplete",
      "aria-haspopup": "listbox",
      role: "combobox",
      "aria-expanded": $options.suggestionVisible,
      "aria-owns": $options.id
    }, [vue.createVNode(_component_el_input, vue.mergeProps({
      ref: "input"
    }, [_ctx.$props, _ctx.$attrs], {
      onInput: $options.handleInput,
      onChange: $options.handleChange,
      onFocus: $options.handleFocus,
      onBlur: $options.handleBlur,
      onClear: $options.handleClear,
      onKeydown: [_cache[1] || (_cache[1] = vue.withKeys(vue.withModifiers($event => $options.highlight($data.highlightedIndex - 1), ["prevent"]), ["up"])), _cache[2] || (_cache[2] = vue.withKeys(vue.withModifiers($event => $options.highlight($data.highlightedIndex + 1), ["prevent"]), ["down"])), vue.withKeys($options.handleKeyEnter, ["enter"]), vue.withKeys($options.close, ["tab"])]
    }), vue.createSlots({
      _: 2
      /* DYNAMIC */

    }, [_ctx.$slots.prepend ? {
      name: "prepend",
      fn: vue.withCtx(() => [vue.renderSlot(_ctx.$slots, "prepend")])
    } : undefined, _ctx.$slots.append ? {
      name: "append",
      fn: vue.withCtx(() => [vue.renderSlot(_ctx.$slots, "append")])
    } : undefined, _ctx.$slots.prefix ? {
      name: "prefix",
      fn: vue.withCtx(() => [vue.renderSlot(_ctx.$slots, "prefix")])
    } : undefined, _ctx.$slots.suffix ? {
      name: "suffix",
      fn: vue.withCtx(() => [vue.renderSlot(_ctx.$slots, "suffix")])
    } : undefined]), 1040
    /* FULL_PROPS, DYNAMIC_SLOTS */
    , ["onInput", "onChange", "onFocus", "onBlur", "onClear", "onKeydown"]), vue.createVNode(_component_el_autocomplete_suggestions, {
      "visible-arrow": "",
      class: [$props.popperClass ? $props.popperClass : ''],
      "popper-options": $props.popperOptions,
      "append-to-body": $props.popperAppendToBody,
      ref: "suggestions",
      placement: $props.placement,
      id: $options.id
    }, {
      default: vue.withCtx(() => [(vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList($data.suggestions, (item, index) => {
        return vue.openBlock(), vue.createBlock("li", {
          key: index,
          class: {
            highlighted: $data.highlightedIndex === index
          },
          onClick: $event => $options.select(item),
          id: `${$options.id}-item-${index}`,
          role: "option",
          "aria-selected": $data.highlightedIndex === index
        }, [vue.renderSlot(_ctx.$slots, "default", {
          item: item
        }, () => [vue.createTextVNode(vue.toDisplayString(item[$props.valueKey]), 1
        /* TEXT */
        )])], 10
        /* CLASS, PROPS */
        , ["onClick", "id", "aria-selected"]);
      }), 128
      /* KEYED_FRAGMENT */
      ))]),
      _: 1
      /* STABLE */

    }, 8
    /* PROPS */
    , ["class", "popper-options", "append-to-body", "placement", "id"])], 8
    /* PROPS */
    , ["aria-expanded", "aria-owns"])), [[_directive_clickoutside, $options.close]]);
  }

  script.render = render;
  script.__file = "packages/autocomplete/src/autocomplete.vue";

  /* istanbul ignore next */

  script.install = function (app) {
    app.component(script.name, script);
  };

  var version = "0.0.39";

  // 用于构建时的入口
  const components = [ElRow, script$1B, script$1z, script$1y, script$O, script$N, script$1x, script$1w, script$C, script$1A, script$1u, script$1t, script$19, script$16, script$1s, script$1v, script$q, script$p, script$3, script$K, script$w, script$v, script$u, script$t, ElPagination, script$1h, script$E, script$D, script$e, script$d, script$s, script$r, script$o, script$n, script$m, script$l, script$k, script$j, ElLoading, script$T, script$R, script$P, ElTableColumn, script$1r, script$1q, script$1p, script$1o, script$1n, script$1m, script$1l, script$1k, script$1g, script$1b, script$1c, script$17, // ElTimePicker,
  // ElTimeSelect,
  // ElDatePicker,
  script$12, script$11, script$X, script$U, script$1i, script$1f, script$i, ElTooltip, script$h, script$g, script$f, script$c, script$b, script$a, script$9, script$8, script$6, script$4, ElInfiniteScroll, script$2, ElScrollbar, script, ElCollapseTransition];

  const install = (app, opts = {}) => {
    app.use(setupGlobalOptions(opts));
    components.forEach(component => {
      app.use(component);
    });
    applyOptions(app);
  };

  function applyOptions(app) {
    app.config.globalProperties.$loading = ElLoading.service;
    app.config.globalProperties.$msgbox = MessageBox;
    app.config.globalProperties.$alert = MessageBox.alert;
    app.config.globalProperties.$confirm = MessageBox.confirm;
    app.config.globalProperties.$prompt = MessageBox.prompt;
    app.config.globalProperties.$notify = Notification;
    app.config.globalProperties.$message = Message;
  }

  const element3 = {
    version,
    install
  };

  exports.ElAlert = script$C;
  exports.ElAside = script$1x;
  exports.ElAutocomplete = script;
  exports.ElAvatar = script$D;
  exports.ElBacktop = script$3;
  exports.ElBadge = script$E;
  exports.ElBreadcrumb = script$q;
  exports.ElBreadcrumbItem = script$p;
  exports.ElButton = script$1u;
  exports.ElButtonGroup = script$1t;
  exports.ElCalendar = script$6;
  exports.ElCard = script$f;
  exports.ElCarousel = script$e;
  exports.ElCarouselItem = script$d;
  exports.ElCascader = script$1b;
  exports.ElCascaderPanel = script$1c;
  exports.ElCheckbox = script$1o;
  exports.ElCheckboxButton = script$1n;
  exports.ElCheckboxGroup = script$1m;
  exports.ElCol = script$1B;
  exports.ElCollapse = script$c;
  exports.ElCollapseItem = script$b;
  exports.ElCollapseTransition = ElCollapseTransition;
  exports.ElColorPicker = script$X;
  exports.ElContainer = script$1A;
  exports.ElDialog = script$i;
  exports.ElDivider = script$8;
  exports.ElDrawer = script$2;
  exports.ElDropdown = script$n;
  exports.ElDropdownItem = script$m;
  exports.ElDropdownMenu = script$l;
  exports.ElFooter = script$1y;
  exports.ElForm = script$T;
  exports.ElFormItem = script$R;
  exports.ElHeader = script$1z;
  exports.ElIcon = script$1v;
  exports.ElImage = script$4;
  exports.ElInfiniteScroll = ElInfiniteScroll;
  exports.ElInput = script$1l;
  exports.ElInputNumber = script$1k;
  exports.ElLink = script$1s;
  exports.ElLoading = ElLoading;
  exports.ElMain = script$1w;
  exports.ElMenu = script$w;
  exports.ElMenuItem = script$v;
  exports.ElMenuItemGroup = script$t;
  exports.ElNewTable = script$O;
  exports.ElNewTableColumn = script$N;
  exports.ElOption = script$1i;
  exports.ElOptionGroup = script$1f;
  exports.ElPageHeader = script$o;
  exports.ElPagination = ElPagination;
  exports.ElPopconfirm = script$g;
  exports.ElPopover = script$h;
  exports.ElProgress = script$16;
  exports.ElRadio = script$1r;
  exports.ElRadioButton = script$1q;
  exports.ElRadioGroup = script$1p;
  exports.ElRate = script$11;
  exports.ElRow = ElRow;
  exports.ElScrollbar = ElScrollbar;
  exports.ElSelect = script$1g;
  exports.ElSlider = script$17;
  exports.ElStep = script$j;
  exports.ElSteps = script$k;
  exports.ElSubmenu = script$u;
  exports.ElSwitch = script$19;
  exports.ElTabPane = script$r;
  exports.ElTable = script$P;
  exports.ElTableColumn = ElTableColumn;
  exports.ElTabs = script$s;
  exports.ElTag = script$1h;
  exports.ElTimeline = script$a;
  exports.ElTimelineItem = script$9;
  exports.ElTooltip = ElTooltip;
  exports.ElTransfer = script$U;
  exports.ElTree = script$K;
  exports.ElUpload = script$12;
  exports.Message = Message;
  exports.Msgbox = MessageBox;
  exports.Notification = Notification;
  exports.default = element3;
  exports.install = install;
  exports.setupGlobalOptions = setupGlobalOptions;
  exports.version = version;

  Object.defineProperty(exports, '__esModule', { value: true });

  return exports;

}({}, Vue));
